fix: Resolve infinite recursion in options app initialization (#72)

Author: Amm1rr

Changelog.md

@@ -1,4 +1,12 @@
-#### v1.4.6 – Released on November 1, 2025
+#### v1.4.7 – Released on November 01, 2025
+
+##### Fixed
+
+- Fixed options page opening issue.
+
+---
+
+#### v1.4.6 – Released on November 01, 2025
 
 ##### Fixed
 

…blish/Translate-It-v1.4.6-for-Chrome.zip …blish/Translate-It-v1.4.7-for-Chrome.zipdist/Publish/Translate-It-v1.4.6-for-Chrome.zip renamed to dist/Publish/Translate-It-v1.4.7-for-Chrome.zip dist/Publish/Translate-It-v1.4.6-for-Chrome.zip renamed to dist/Publish/Translate-It-v1.4.7-for-Chrome.zip

@@ -1,6 +1,6 @@
 {
   "name": "translate-it",
-  "version": "1.4.6",
+  "version": "1.4.7",
   "type": "module",
   "description": "Smart Translation Assistant",
   "scripts": {

…lish/Translate-It-v1.4.6-for-Firefox.zip …lish/Translate-It-v1.4.7-for-Firefox.zipdist/Publish/Translate-It-v1.4.6-for-Firefox.zip renamed to dist/Publish/Translate-It-v1.4.7-for-Firefox.zip dist/Publish/Translate-It-v1.4.6-for-Firefox.zip renamed to dist/Publish/Translate-It-v1.4.7-for-Firefox.zip

@@ -69,11 +69,12 @@ async function initializeApp() {
     await setI18nLocale(userLocale);
     logger.debug('✅ vue-i18n plugin locale set:', userLocale)
 
-    // Check for tab query parameter for Firefox shortcuts navigation
-    let initialRoute = '/';
+    // Check for tab query parameter for Firefox shortcuts navigation and hash URLs
+    let initialRoute = '/languages'; // Default to languages tab
     let shouldNavigateToHelp = false;
 
     try {
+      // First check query parameters (for Firefox shortcuts)
       const urlParams = new URLSearchParams(window.location.search);
       const tabParam = urlParams.get('tab');
 
@@ -86,6 +87,21 @@ async function initializeApp() {
         // For Firefox help navigation, redirect to help tab
         initialRoute = '/help';
         logger.debug('Detected tab=help parameter, redirecting to help tab for Firefox');
+      } else {
+        // If no query parameter, check hash URL
+        const hash = window.location.hash.replace('#', '').replace('/', '');
+        if (hash === 'help' || hash === 'shortcuts') {
+          initialRoute = '/help';
+          logger.debug(`Detected hash #${hash}, redirecting to help tab`);
+        } else if (hash && hash !== '') {
+          // Use the hash path if it's valid
+          const validRoutes = ['languages', 'appearance', 'activation', 'prompt', 'api', 'import-export', 'advance', 'about', 'help'];
+          if (validRoutes.includes(hash)) {
+            initialRoute = `/${hash}`;
+            logger.debug(`Detected hash #${hash}, redirecting to ${initialRoute} tab`);
+          }
+        }
+        // If hash is empty or '/', keep default languages route
       }
     } catch (e) {
       logger.debug('Failed to parse URL parameters:', e);
@@ -96,7 +112,22 @@ async function initializeApp() {
     const router = createRouter({
       history: createWebHashHistory(),
       routes: [
-        { path: '/', redirect: initialRoute },
+        { path: '/', redirect: () => {
+          // Avoid infinite redirect by checking current hash
+          const currentHash = window.location.hash.replace('#', '').replace('/', '');
+          if (currentHash === '' || currentHash === '/') {
+            logger.debug(`Root redirect: current hash is empty, redirecting to ${initialRoute}`);
+            return initialRoute;
+          }
+          // If current hash matches a valid route, use it instead
+          const validRoutes = ['languages', 'appearance', 'activation', 'prompt', 'api', 'import-export', 'advance', 'about', 'help'];
+          if (validRoutes.includes(currentHash)) {
+            logger.debug(`Root redirect: current hash #${currentHash} is valid, using it`);
+            return `/${currentHash}`;
+          }
+          logger.debug(`Root redirect: using default route ${initialRoute}`);
+          return initialRoute;
+        }},
         { path: '/languages', component: LanguagesTab, name: 'languages' },
         { path: '/appearance', component: AppearanceTab, name: 'appearance' },
         { path: '/activation', component: ActivationTab, name: 'activation' },