Localize UnlockSuccess.tsx (#1006)

apps/browser-extension/src/entrypoints/popup/pages/Unlock.tsx

@@ -26,7 +26,7 @@ import { storage } from '#imports';
  */
 const Unlock: React.FC = () => {
   const { t } = useTranslation('auth');
-  const { t: tCommon } = useTranslation('common');
+  const { t: tc } = useTranslation('common');
   const authContext = useAuth();
   const dbContext = useDb();
   const navigate = useNavigate();
@@ -45,16 +45,16 @@ const Unlock: React.FC = () => {
      */
     const checkStatus = async () : Promise<void> => {
       const statusResponse = await webApi.getStatus();
-      const statusError = webApi.validateStatusResponse(statusResponse, tCommon);
+      const statusError = webApi.validateStatusResponse(statusResponse);
       if (statusError !== null) {
-        await webApi.logout(statusError);
+        await webApi.logout(tc(statusError));
         navigate('/logout');
       }
       setIsInitialLoading(false);
     };
 
     checkStatus();
-  }, [webApi, authContext, setIsInitialLoading, navigate, tCommon]);
+  }, [webApi, authContext, setIsInitialLoading, navigate, tc]);
 
   // Set header buttons on mount and clear on unmount
   useEffect((): (() => void) => {
@@ -146,7 +146,7 @@ const Unlock: React.FC = () => {
               {authContext.username}
             </p>
             <p className="text-xs text-gray-500 dark:text-gray-400">
-              {t('common:success', 'Logged in')}
+              {t('loggedIn')}
             </p>
           </div>
         </div>

apps/browser-extension/src/entrypoints/popup/pages/UnlockSuccess.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
 
 /**
@@ -7,6 +8,7 @@ import { useNavigate } from 'react-router-dom';
  */
 const UnlockSuccess: React.FC = () => {
   const navigate = useNavigate();
+  const { t } = useTranslation('auth');
 
   /**
    * Handle browsing vault contents - navigate to credentials page and reset mode parameter
@@ -29,23 +31,23 @@ const UnlockSuccess: React.FC = () => {
         </svg>
       </div>
       <h2 className="text-xl font-semibold mb-4 text-gray-900 dark:text-white">
-      Your vault is successfully unlocked
+        {t('unlockSuccessTitle')}
       </h2>
       <p className="mb-6 text-gray-600 dark:text-gray-400">
-      You can now use autofill in login forms in your browser.
+        {t('unlockSuccessDescription')}
       </p>
       <div className="space-y-3 w-full">
         <button
           onClick={() => window.close()}
           className="w-full px-4 py-2 text-white bg-primary-600 rounded hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2"
         >
-          Close this popup
+          {t('closePopup')}
         </button>
         <button
           onClick={handleBrowseVaultContents}
           className="w-full px-4 py-2 text-gray-700 bg-gray-100 rounded hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600"
         >
-          Browse vault contents
+          {t('browseVault')}
         </button>
       </div>
     </div>

apps/browser-extension/src/locales/en/auth.json

@@ -22,8 +22,13 @@
   "logoutConfirm": "Are you sure you want to logout?",
   "sessionExpired": "Your session has expired. Please log in again.",
   "unlockSuccess": "Vault unlocked successfully!",
+  "unlockSuccessTitle": "Your vault is successfully unlocked",
+  "unlockSuccessDescription": "You can now use autofill in login forms in your browser.",
+  "closePopup": "Close this popup",
+  "browseVault": "Browse vault contents",
   "connectingTo": "Connecting to",
   "switchAccounts": "Switch accounts?",
+  "loggedIn": "Logged in",
   "errors": {
     "invalidCode": "Please enter a valid 6-digit authentication code.",
     "serverError": "Could not reach AliasVault server. Please try again later or contact support if the problem persists.",

apps/browser-extension/src/locales/nl/auth.json

@@ -22,7 +22,12 @@
   "logoutConfirm": "Weet je zeker dat je wilt uitloggen?",
   "sessionExpired": "Je sessie is verlopen. Log opnieuw in.",
   "unlockSuccess": "Vault succesvol ontgrendeld!",
+  "unlockSuccessTitle": "Je vault is succesvol ontgrendeld",
+  "unlockSuccessDescription": "Je kunt nu automatisch invullen gebruiken in inlogformulieren in je browser.",
+  "closePopup": "Sluit deze popup",
+  "browseVault": "Bekijk vault-inhoud",
   "connectingTo": "Verbinden met",
+  "loggedIn": "Ingelogd",
   "errors": {
     "invalidCode": "Voer een geldige 6-cijferige code in.",
     "serverError": "Kon de AliasVault server niet bereiken. Probeer het later opnieuw of neem contact op met support als het probleem aanhoudt.",