chore: Update Tailwind CSS configuration and localization in NovaShield

#3

- Remove unused Tailwind CSS base styles
- Add localization support for NovaShield components
- Update Tailwind CSS configuration to generate colors dynamically

config/nova-shield.php

@@ -31,4 +31,9 @@
         'attachAny{Model}',
         'detach{Model}',
     ],
+
+    'langs' => [
+        // lang_path('en/nova-shield.json'),
+        // base_path('langs/en/nova-shield.json'),
+    ],
 ];

resources/css/tool.css

@@ -1,3 +1,2 @@
-@tailwind base;
 @tailwind components;
 @tailwind utilities;

resources/js/components/policy.vue

@@ -1,7 +1,9 @@
 <script>
 import Switch from './switch.vue';
+import { Localization } from 'laravel-nova'
 
 export default {
+    mixins: [Localization],
     props: {
         policy: {
             type: String,
@@ -45,7 +47,7 @@ export default {
 </script>
 <template>
     <label class="flex flex-row flex-wrap justify-between items-center">
-        <span class="flex-none ns-font-bold">{{ policy }}</span>
+        <span class="flex-none ns-font-bold">{{ __(policy) }}</span>
         <span>
             <Switch :disabled="disabled" class="grow" v-model="value" />
         </span>

resources/js/components/resourceCard.vue

@@ -1,8 +1,11 @@
 <script>
 import Policy from './policy.vue';
 import Switch from './switch.vue';
+import { Localization } from 'laravel-nova'
+
 
 export default {
+    mixins: [Localization],
     props: {
         resource: {
             type: Object,
@@ -71,7 +74,7 @@ export default {
         <Card class="ns-snap-start ns-snap-always">
             <div
                 class="px-4 py-5 sm:px-6 flex flex-row items-center justify-between border-b border-gray-200 dark:border-gray-700">
-                <label :for="`id_${resource.prefix}`" class="text-lg font-medium">{{ resource.name }}</label>
+                <label :for="`id_${resource.prefix}`" class="text-lg font-medium">{{ __(resource.name) }}</label>
                 <Switch :disabled="disabled" :id="`id_${resource.prefix}`" v-model="selectAllPolicy" />
             </div>
             <div class="ns-px-4 ns-py-5 ns-relative">

resources/js/tool.js

@@ -4,6 +4,7 @@ import IndexField from "./fields/IndexField.vue";
 import Panel from "./components/panel.vue";
 
 Nova.booting((app, store) => {
+    console.log(window.Nova.__)
   app.component("FormNovaShieldPanel", Panel);
   app.component("DetailNovaShieldPanel", Panel);
 

src/ToolServiceProvider.php

@@ -6,6 +6,7 @@
 use Ferdiunal\NovaShield\Http\Nova\ShieldResource;
 use Ferdiunal\NovaShield\Lib\NovaResources;
 use Illuminate\Support\Facades\Context;
+use Illuminate\Support\Facades\File;
 use Illuminate\Support\Facades\Route;
 use Illuminate\Support\ServiceProvider;
 use Laravel\Nova\Events\ServingNova;
@@ -58,12 +59,25 @@ public function boot()
 
         Nova::serving(function (ServingNova $event) {
             ShieldResource::$model = config('permission.models.role');
+            $this->translations();
             Nova::resources([
                 ShieldResource::class,
             ]);
         });
     }
 
+    protected function translations()
+    {
+        $langs = $this->app['config']->get('nova-shield.langs', []);
+        $locale = $this->app->getLocale();
+
+        foreach ($langs as $lang) {
+            if (File::exists($lang) && File::isFile($lang) && File::extension($lang) === 'json' && str($lang)->contains("/$locale/")) {
+                Nova::translations($lang);
+            }
+        }
+    }
+
     public function configuration()
     {
         if (! $this->app->configurationIsCached()) {

tailwind.config.js

@@ -1,18 +1,17 @@
-// import novaTailwind from "../../../vendor/laravel/nova/tailwind.config.js";
-const path = require("path");
-const novaTailwind = require(path.resolve(
-    __dirname,
-    "../../vendor/laravel/nova/tailwind.config.js"
-));
 
+import { generateTailwindColors } from '../../vendor/laravel/nova/generators'
+// import NovaConfig from '../../vendor/laravel/nova/tailwind.config'
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-    prefix: "ns-",
-    content: ["./resources/**/*{js,vue,blade.php}"],
-    darkMode: ["class"],
-    theme: {
-        colors: novaTailwind.theme.colors,
-        extend: {},
-    },
-    plugins: [require("tailwindcss-animated")],
-};
+  content: ['./resources/**/*.{js,vue}'],
+  darkMode: ['class', '[class*="dark"]'],
+  prefix: 'ns-',
+  corePlugins: {
+    preflight: false,
+  },
+  theme: {
+    colors: generateTailwindColors(),
+    extend: {},
+  },
+  plugins: [require("tailwindcss-animated")],
+}