From 598455b7f459073e51d0e88bf543731ab1d76532 Mon Sep 17 00:00:00 2001
From: Sheen Capadngan <sheensantoscapadngan@gmail.com>
Date: Thu, 16 Oct 2025 01:56:39 +0800
Subject: [PATCH] misc: addressed frontend lint issues

---
 .../routes/v3/external-migration-router.ts       |  2 +-
 .../IdentityKubernetesAuthForm.tsx               |  6 +++---
 .../VaultKubernetesAuthImportModal.tsx           |  4 ++--
 .../ExternalMigrationsTab.tsx                    | 16 ++++++++--------
 .../components/VaultConnectionSection.tsx        |  8 ++++----
 .../components/AddPoliciesButton.tsx             |  2 +-
 .../components/VaultPolicyImportModal.tsx        | 10 +++++-----
 .../components/ActionBar/ActionBar.tsx           | 12 ++++++------
 .../ActionBar/VaultSecretImportModal.tsx         |  8 ++++----
 9 files changed, 34 insertions(+), 34 deletions(-)

diff --git a/backend/src/server/routes/v3/external-migration-router.ts b/backend/src/server/routes/v3/external-migration-router.ts
index 9afbded12..155a1a721 100644
--- a/backend/src/server/routes/v3/external-migration-router.ts
+++ b/backend/src/server/routes/v3/external-migration-router.ts
@@ -129,7 +129,7 @@ export const registerExternalMigrationRouter = async (server: FastifyZodProvider
               id: z.string(),
               orgId: z.string(),
               namespace: z.string(),
-              connectionId: z.string().nullable().optional(),
+              connectionId: z.string().nullish(),
               createdAt: z.date(),
               updatedAt: z.date()
             })
diff --git a/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx b/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx
index bc010e633..0296169b7 100644
--- a/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx
+++ b/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx
@@ -404,9 +404,9 @@ export const IdentityKubernetesAuthForm = ({
         </TabList>
         <TabPanel value={IdentityFormTab.Configuration}>
           {hasVaultConnection && !isUpdate && (
-            <div className="bg-primary/10 border-primary/30 mb-4 flex items-center justify-between rounded-md border p-3">
+            <div className="mb-4 flex items-center justify-between rounded-md border border-primary/30 bg-primary/10 p-3">
               <div className="flex items-start gap-2 text-sm">
-                <FontAwesomeIcon icon={faInfoCircle} className="text-primary mt-0.5" />
+                <FontAwesomeIcon icon={faInfoCircle} className="mt-0.5 text-primary" />
                 <span className="text-mineshaft-200">Load values from HashiCorp Vault</span>
               </div>
               <Button
@@ -467,7 +467,7 @@ export const IdentityKubernetesAuthForm = ({
                                   );
                                 }
                               }}
-                              className="border-mineshaft-500 w-full border"
+                              className="w-full border border-mineshaft-500"
                               dropdownContainerClassName="max-w-none"
                               isLoading={isGatewayLoading}
                               placeholder="Default: Internet Gateway"
diff --git a/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/VaultKubernetesAuthImportModal.tsx b/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/VaultKubernetesAuthImportModal.tsx
index f31921b90..3c3fd6df1 100644
--- a/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/VaultKubernetesAuthImportModal.tsx
+++ b/frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/VaultKubernetesAuthImportModal.tsx
@@ -80,7 +80,7 @@ const Content = ({ onClose, onImport }: ContentProps) => {
             placeholder="Select namespace..."
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Select the Vault namespace to fetch available Kubernetes auth roles
           </p>
         </>
@@ -105,7 +105,7 @@ const Content = ({ onClose, onImport }: ContentProps) => {
             isClearable
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Select the Kubernetes role to load configuration from
           </p>
         </>
diff --git a/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/ExternalMigrationsTab.tsx b/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/ExternalMigrationsTab.tsx
index a21035a70..34f1937b5 100644
--- a/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/ExternalMigrationsTab.tsx
+++ b/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/ExternalMigrationsTab.tsx
@@ -17,10 +17,10 @@ export const ExternalMigrationsTab = () => {
   return (
     <div className="flex flex-col gap-6">
       {/* In-Platform Migration Tooling Section */}
-      <div className="border-mineshaft-600 bg-mineshaft-900 rounded-lg border p-4">
+      <div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
         <div className="mb-4">
-          <h2 className="text-mineshaft-100 text-xl font-medium">In-Platform Migration Tooling</h2>
-          <p className="mb-6 mt-1 text-sm text-gray-400">
+          <h2 className="text-xl font-medium text-mineshaft-100">In-Platform Migration Tooling</h2>
+          <p className="mt-1 mb-6 text-sm text-gray-400">
             Configure platform connections to enable migration features throughout Infisical, such
             as importing policies and resources directly within the UI.
           </p>
@@ -29,10 +29,10 @@ export const ExternalMigrationsTab = () => {
       </div>
 
       {/* Bulk Data Import Section */}
-      <div className="border-mineshaft-600 bg-mineshaft-900 rounded-lg border p-4">
+      <div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
         <div className="mb-4">
-          <h2 className="text-mineshaft-100 text-xl font-medium">Bulk Data Import</h2>
-          <p className="mb-6 mt-1 text-sm text-gray-400">
+          <h2 className="text-xl font-medium text-mineshaft-100">Bulk Data Import</h2>
+          <p className="mt-1 mb-6 text-sm text-gray-400">
             Perform one-time bulk imports of data from external platforms.
           </p>
         </div>
@@ -40,7 +40,7 @@ export const ExternalMigrationsTab = () => {
         <div className="flex items-start justify-between">
           <div>
             <div className="flex items-center gap-2">
-              <p className="text-mineshaft-100 text-base font-medium">
+              <p className="text-base font-medium text-mineshaft-100">
                 Import from external source
               </p>
               <a
@@ -48,7 +48,7 @@ export const ExternalMigrationsTab = () => {
                 rel="noopener noreferrer"
                 href="https://infisical.com/docs/documentation/platform/external-migrations/overview"
               >
-                <div className="bg-yellow/20 text-yellow inline-block rounded-md px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm opacity-80 hover:opacity-100">
+                <div className="inline-block rounded-md bg-yellow/20 px-1.5 pt-[0.04rem] pb-[0.03rem] text-sm text-yellow opacity-80 hover:opacity-100">
                   <FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
                   Docs
                   <FontAwesomeIcon
diff --git a/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/components/VaultConnectionSection.tsx b/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/components/VaultConnectionSection.tsx
index 9e8b46826..cbda0a6c4 100644
--- a/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/components/VaultConnectionSection.tsx
+++ b/frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/components/VaultConnectionSection.tsx
@@ -83,10 +83,10 @@ export const VaultConnectionSection = () => {
           <img
             src="/images/integrations/Vault.png"
             alt="HashiCorp Vault logo"
-            className="bg-bunker-500 h-10 w-10 rounded-md p-2"
+            className="h-10 w-10 rounded-md bg-bunker-500 p-2"
           />
           <div>
-            <h3 className="text-mineshaft-100 text-lg font-medium">HashiCorp Vault</h3>
+            <h3 className="text-lg font-medium text-mineshaft-100">HashiCorp Vault</h3>
             <p className="text-sm text-gray-400">
               Enable in-platform migration tooling for policy imports and secret engine migrations
             </p>
@@ -119,7 +119,7 @@ export const VaultConnectionSection = () => {
               <Tr>
                 <Td colSpan={3}>
                   <EmptyState title="No namespace configurations" icon={faPlus} className="py-8">
-                    <p className="text-mineshaft-400 mb-4 text-sm">
+                    <p className="mb-4 text-sm text-mineshaft-400">
                       Add a namespace configuration to enable in-platform migration features.
                     </p>
                   </EmptyState>
@@ -159,7 +159,7 @@ export const VaultConnectionSection = () => {
         </Table>
       </TableContainer>
 
-      <p className="text-mineshaft-400 mt-4 text-xs">
+      <p className="mt-4 text-xs text-mineshaft-400">
         Configure namespace-specific connections to enable in-platform migration features. Manage
         connections in the App Connections section.
       </p>
diff --git a/frontend/src/pages/project/RoleDetailsBySlugPage/components/AddPoliciesButton.tsx b/frontend/src/pages/project/RoleDetailsBySlugPage/components/AddPoliciesButton.tsx
index bf581f7e2..16ceb1863 100644
--- a/frontend/src/pages/project/RoleDetailsBySlugPage/components/AddPoliciesButton.tsx
+++ b/frontend/src/pages/project/RoleDetailsBySlugPage/components/AddPoliciesButton.tsx
@@ -56,7 +56,7 @@ export const AddPoliciesButton = ({ isDisabled, projectType }: Props) => {
           <IconButton
             ariaLabel="Open policy template options"
             variant="outline_bg"
-            className="bg-mineshaft-600 rounded-l-none p-3"
+            className="rounded-l-none bg-mineshaft-600 p-3"
           >
             <FontAwesomeIcon icon={faAngleDown} />
           </IconButton>
diff --git a/frontend/src/pages/project/RoleDetailsBySlugPage/components/VaultPolicyImportModal.tsx b/frontend/src/pages/project/RoleDetailsBySlugPage/components/VaultPolicyImportModal.tsx
index 62f04e770..0749877af 100644
--- a/frontend/src/pages/project/RoleDetailsBySlugPage/components/VaultPolicyImportModal.tsx
+++ b/frontend/src/pages/project/RoleDetailsBySlugPage/components/VaultPolicyImportModal.tsx
@@ -146,9 +146,9 @@ const Content = ({ onClose }: ContentProps) => {
 
   return (
     <>
-      <div className="bg-primary/10 text-mineshaft-200 mb-4 rounded-md p-3 text-sm">
+      <div className="mb-4 rounded-md bg-primary/10 p-3 text-sm text-mineshaft-200">
         <div className="flex items-start gap-2">
-          <FontAwesomeIcon icon={faInfoCircle} className="text-primary mt-0.5" />
+          <FontAwesomeIcon icon={faInfoCircle} className="mt-0.5 text-primary" />
           <div>
             <div className="mb-2">
               <strong>How Policy Translation Works</strong>
@@ -192,7 +192,7 @@ const Content = ({ onClose }: ContentProps) => {
             placeholder="Select namespace..."
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Select the Vault namespace to fetch policies and mount information
           </p>
         </>
@@ -218,7 +218,7 @@ const Content = ({ onClose }: ContentProps) => {
             isClearable
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Select a policy to auto-populate the HCL editor below, or skip to paste your own
           </p>
         </>
@@ -239,7 +239,7 @@ path "secret/metadata/prod/*" {
             rows={12}
             className="font-mono text-sm"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Paste your HCL policy here or select one from the dropdown above. The translator will
             extract environments and paths automatically.
           </p>
diff --git a/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/ActionBar.tsx b/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/ActionBar.tsx
index 0bf85a15e..182bb1d80 100644
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/ActionBar.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/ActionBar.tsx
@@ -828,8 +828,8 @@ export const ActionBar = ({
                       {Boolean(filteredTags) && <Badge>{filteredTags} Applied</Badge>}
                     </div>
                   </DropdownSubMenuTrigger>
-                  <DropdownSubMenuContent className="thin-scrollbar max-h-80 overflow-y-auto rounded-l-none">
-                    <DropdownMenuLabel className="bg-mineshaft-900 sticky top-0">
+                  <DropdownSubMenuContent className="max-h-80 thin-scrollbar overflow-y-auto rounded-l-none">
+                    <DropdownMenuLabel className="sticky top-0 bg-mineshaft-900">
                       <div className="flex w-full items-center justify-between">
                         <span>Filter by Secret Tags</span>
                         <Tooltip content="Matches secrets with one or more of the applied tags">
@@ -970,7 +970,7 @@ export const ActionBar = ({
               <IconButton
                 ariaLabel="add-folder-or-import"
                 variant="outline_bg"
-                className="bg-mineshaft-600 rounded-l-none p-3"
+                className="rounded-l-none bg-mineshaft-600 p-3"
               >
                 <FontAwesomeIcon icon={faAngleDown} />
               </IconButton>
@@ -1147,11 +1147,11 @@ export const ActionBar = ({
           isMultiSelectActive && "h-16"
         )}
       >
-        <div className="border-mineshaft-600 bg-mineshaft-800 text-bunker-300 mt-3.5 flex items-center rounded-md border px-4 py-2">
+        <div className="mt-3.5 flex items-center rounded-md border border-mineshaft-600 bg-mineshaft-800 px-4 py-2 text-bunker-300">
           <div className="mr-2 text-sm">{Object.keys(selectedSecrets).length} Selected</div>
           <button
             type="button"
-            className="text-mineshaft-400 hover:text-mineshaft-200 mr-auto text-xs underline-offset-2 hover:underline"
+            className="mr-auto text-xs text-mineshaft-400 underline-offset-2 hover:text-mineshaft-200 hover:underline"
             onClick={resetSelectedSecret}
           >
             Unselect All
@@ -1338,7 +1338,7 @@ export const ActionBar = ({
         onOpenChange={(open) => handlePopUpToggle("requestAccess", open)}
       >
         <ModalContent title="Access Restricted">
-          <p className="text-bunker-300 mb-2">You do not have permission to perform this action.</p>
+          <p className="mb-2 text-bunker-300">You do not have permission to perform this action.</p>
           <p className="text-bunker-300">Request access to perform this action in this folder.</p>
           <div className="mt-8 flex items-center gap-4">
             <ModalClose asChild>
diff --git a/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/VaultSecretImportModal.tsx b/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/VaultSecretImportModal.tsx
index 7386f74be..d9294500d 100644
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/VaultSecretImportModal.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/ActionBar/VaultSecretImportModal.tsx
@@ -81,9 +81,9 @@ const Content = ({ onClose, environment, secretPath, onImport }: ContentProps) =
 
   return (
     <>
-      <div className="bg-primary/10 text-mineshaft-200 mb-4 rounded-md p-3 text-sm">
+      <div className="mb-4 rounded-md bg-primary/10 p-3 text-sm text-mineshaft-200">
         <div className="flex items-start gap-2">
-          <FontAwesomeIcon icon={faInfoCircle} className="text-primary mt-0.5" />
+          <FontAwesomeIcon icon={faInfoCircle} className="mt-0.5 text-primary" />
           <div>
             <div className="mb-2">
               <strong>Import Secrets from HashiCorp Vault</strong>
@@ -121,7 +121,7 @@ const Content = ({ onClose, environment, secretPath, onImport }: ContentProps) =
             placeholder="Select namespace..."
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Select the Vault namespace to fetch available secret paths
           </p>
         </>
@@ -146,7 +146,7 @@ const Content = ({ onClose, environment, secretPath, onImport }: ContentProps) =
             isClearable
             className="w-full"
           />
-          <p className="text-mineshaft-400 mt-1 text-xs">
+          <p className="mt-1 text-xs text-mineshaft-400">
             Choose a secret path from your Vault namespace to import into Infisical
           </p>
         </>