2.4 KiB
2.4 KiB
Iteration Log: Account Dropdown Scaling and Role Sorting Fixes
- Iterasi:
n(Deploying dropdown scaling, role ordering, and modal refactoring fixes) - Tanggal: 2026-07-28 14:30
Yang Diminta
- Perbaiki layout/ukuran dropdown select role pada modal registrasi yang terlalu besar di screen scaled down.
- Hapus keterangan dalam kurung "(Read-Only Global Access)" pada role Executive.
- Urutkan role dari yang tertinggi ke terendah:
- Global/Tenant Roles: Executive -> Tenant Admin -> SOC Analyst -> Engineer -> Company Admin.
- Company Roles: Company Operator -> Company Viewer.
- Ubah default role di modal pendaftaran akun eksternal dari
SOC AnalystmenjadiCompany Admin.
Langkah yang Diambil
- Frontend - Custom Scaled Dropdown component (
RoleSelect.tsx): Created a custom dropdown rendering options list box directly inside the React/HTML DOM tree, styled in absolute/relative layouts to align with viewport auto-scaling. - Frontend - Role Clean-up & Order Refactoring:
- Removed parenthesized suffix detail from
EXECUTIVErole description. - Sorted roles by rank in
RoleSelect.tsx.
- Removed parenthesized suffix detail from
- Frontend - Default Role Modification:
- Changed initial state value and conditional defaults of
roleinuseExternalAccountForm.tstoCOMPANY_ADMIN.
- Changed initial state value and conditional defaults of
- Frontend - Modularization & 256-line Refactoring:
- Split
ExternalAccountModal.tsxinto multiple single-purpose modules to strictly satisfy the repo's 256-line threshold limit. - Extracted state management and event functions (submit, delete, input checks, file upload) into a custom React Hook
useExternalAccountForm.ts. - Extracted UI checklist logic for selecting network agents into
AgentChecklist.tsx. - Extracted profile image picker and thumbnail preview layout into
ProfilePictureInput.tsx. - Integrated components inside
ExternalAccountModal.tsx, reducing its total line size from 411 down to 204 lines.
- Split
Hasil & Status Codebase saat Ini
- Pembangunan (build) kode Next.js terbukti sukses tanpa kesalahan kompilasi TypeScript/Webpack.
- Dropdown role modal registrasi tidak lagi mengalami ukuran visual yang tidak proporsional saat viewport diperkecil (auto-scaled).
- Hierarki opsi role tersusun rapi dari tingkat tertinggi hingga terendah dengan default pilihan mengarah pada Company Admin.
- Label role Executive bersih dari penjelasan dalam kurung.