https://jespertandersen.github.io/Portfolio/tags/forms/Recent content in Forms on Jesper Andersen - Blog & DevLogHugo -- gohugo.ioencph-ja472@stud.ek.dk (Jesper Andersen)cph-ja472@stud.ek.dk (Jesper Andersen)© 2026 Jesper AndersenSat, 16 May 2026 00:00:00 +0000https://jespertandersen.github.io/Portfolio/devlog/maintenancelog-twelfthweek/Sat, 16 May 2026 00:00:00 +0000cph-ja472@stud.ek.dk (Jesper Andersen)https://jespertandersen.github.io/Portfolio/devlog/maintenancelog-twelfthweek/<h1 class="relative group">Devlog Week 12: User Profiles, Employee Admin Actions, and Form Patterns <div id="devlog-week-12-user-profiles-employee-admin-actions-and-form-patterns" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#devlog-week-12-user-profiles-employee-admin-actions-and-form-patterns" aria-label="Anchor">#</a> </span> </h1> <p>This entry covers the employee-facing parts of the UI: profile views, edit flows, admin actions, and the form patterns used to keep components maintainable.</p> <h2 class="relative group">What Changed <div id="what-changed" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#what-changed" aria-label="Anchor">#</a> </span> </h2> <ul> <li><code>UserProfile</code> supports both &ldquo;me&rdquo; and viewing other employees via dynamic route params</li> <li>Profile page extracted into focused subcomponents: <ul> <li><code>EditProfileForm</code>, <code>AdminActions</code>, <code>PasswordChangeForm</code></li> </ul> </li> <li>Form handling uses a mix of controlled inputs and a <code>FormData</code> approach (when appropriate)</li> <li><code>useEffect</code> race-condition prevention via an <code>ignore</code> flag to avoid setting state after unmount</li> <li>Admin-only employee actions (deactivate/reactivate) gated by role and disallowed on own profile</li> </ul> <hr> <h2 class="relative group">User Profile: “Me” vs “Other Employee” <div id="user-profile-me-vs-other-employee" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#user-profile-me-vs-other-employee" aria-label="Anchor">#</a> </span> </h2> <p>The profile route supports multiple entry points:</p>