feat: add hooks React

Author: eramitgupta

resources/js/hooks/useLang.tsx

@@ -0,0 +1,49 @@
+import { usePage } from '@inertiajs/react'
+
+type Replaces = Record<string, string | number>
+type LangValue = string | { [key: string]: string | LangValue }
+type LangObject = Record<string, LangValue>
+
+export function useLang() {
+    const { lang } = usePage<{ lang: LangObject }>().props
+
+    function trans(key: string, replaces: Replaces | string = {}): string {
+        const raw = getValueFromKey(key)
+        if (typeof raw !== 'string') return key
+
+        let translated = raw
+
+        if (typeof replaces === 'string') {
+            translated += ' ' + replaces
+        } else if (typeof replaces === 'object') {
+            translated = replacePlaceholders(translated, replaces)
+        }
+
+        return translated
+    }
+
+    function __(key: string, replaces: Replaces | string = {}) {
+        return trans(key, replaces)
+    }
+
+    function replacePlaceholders(text: string, replaces: Replaces): string {
+        return Object.entries(replaces).reduce(
+            (acc, [key, val]) => acc.replaceAll(`{${key}}`, String(val)),
+            text
+        )
+    }
+
+    function getValueFromKey(key: string): string | undefined {
+        const segments = key.split('.')
+        let current: any = lang
+
+        for (const segment of segments) {
+            if (typeof current !== 'object' || current === null) return undefined
+            current = current[segment]
+        }
+
+        return typeof current === 'string' ? current : undefined
+    }
+
+    return { trans, __ }
+}

src/Commands/InstallLang.php

@@ -17,15 +17,33 @@ public function handle()
             '--tag' => 'erag:publish-lang-config',
             '--force' => true,
         ]);
-        $this->info('✅ configuration published successfully.');
+        $this->info('✅ Configuration published successfully.');
         $this->newLine();
 
-        $this->info('📦 Publishing JS composable...');
-        $this->call('vendor:publish', [
-            '--tag' => 'erag:publish-lang-composable',
-            '--force' => true,
-        ]);
-        $this->info('✅ JS composable published successfully.');
+        // Ask for frontend framework
+        $choice = $this->choice(
+            '🎯 Which frontend framework are you using?',
+            ['Vue.js', 'React.js'],
+            0
+        );
+
+        if ($choice === 'Vue.js') {
+            $this->info('📦 Publishing Vue composable...');
+            $this->call('vendor:publish', [
+                '--tag' => 'erag:publish-lang-composable-vue',
+                '--force' => true,
+            ]);
+            $this->info('✅ Vue composable published successfully.');
+        }
+
+        if ($choice === 'React.js') {
+            $this->info('📦 Publishing React composable...');
+            $this->call('vendor:publish', [
+                '--tag' => 'erag:publish-lang-composable-react',
+                '--force' => true,
+            ]);
+            $this->info('✅ React composable published successfully.');
+        }
 
         $this->newLine();
         $this->info('🎉 LaravelLangSyncInertia installation completed!');

src/LaravelLangSyncInertiaServiceProvider.php

@@ -50,7 +50,12 @@ protected function publishConfig(): void
 
         $this->publishes([
             __DIR__.'/../resources/js/composables/useLang.ts' => resource_path('js/composables/useLang.ts'),
-        ], 'erag:publish-lang-composable');
+        ], 'erag:publish-lang-composable-vue');
+
+
+        $this->publishes([
+            __DIR__ . '/../resources/js/hooks/useLang.tsx' => resource_path('js/hooks/useLang.tsx'),
+        ], 'erag:publish-lang-composable-react');
 
     }