adding more env variables

src/.env.example

@@ -62,6 +62,9 @@ PUSHER_APP_CLUSTER=mt1
 
 MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
 MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
+MIX_PUSHER_HOST="${PUSHER_HOST}"
+MIX_PUSHER_PORT="${PUSHER_PORT}"
+MIX_PUSHER_SCHEME="${PUSHER_SCHEME}"
 
 INTEGRITY_HASH_HUMANS_TXT=""
 INTEGRITY_HASH_ROBOTS_TXT=""

src/app/Listeners/SuccessfulLogin.php

@@ -29,6 +29,7 @@ class SuccessfulLogin
     public function handle(Login $event): void
     {
         Session::put('timezone_name', $event->user->timezone_name);
+        Session::put('language', $event->user->language->locale);
 
         // Optionally log the info
         /*

src/app/Views/Components/CountryFlags.php

@@ -1,28 +0,0 @@
-<?php
-
-namespace App\View\Components;
-
-use Illuminate\View\Component;
-
-class CountryFlags extends Component
-{
-    /**
-     * Create a new component instance.
-     *
-     * @return void
-     */
-    public function __construct()
-    {
-        //
-    }
-
-    /**
-     * Get the view / contents that represent the component.
-     *
-     * @return \Illuminate\Contracts\View\View|\Closure|string
-     */
-    public function render()
-    {
-        return view('components.country-flags');
-    }
-}

src/package.json

@@ -9,6 +9,12 @@
         "prod": "npm run production",
         "production": "mix --production"
     },
+    "devDependencies": {
+        "laravel-mix": "^6.0.43",
+        "postcss": "^8.4.14",
+        "postcss-import": "^14.1.0",
+        "vue-loader": "^17.0.0"
+    },
     "dependencies": {
         "@inertiajs/inertia": "^0.11.0",
         "@inertiajs/inertia-vue3": "^0.6.0",
@@ -22,13 +28,7 @@
         "lodash": "^4.17.21",
         "notiwind": "^1.2.5",
         "tailwindcss": "^3.0.24",
-        "tailwindcss-neumorphism": "^0.1.0",
+        "tailwindcss-neu": "^0.2.1",
         "vue": "^3.2.36"
-    },
-    "devDependencies": {
-        "laravel-mix": "^6.0.43",
-        "postcss": "^8.4.14",
-        "postcss-import": "^14.1.0",
-        "vue-loader": "^17.0.0"
     }
 }

src/resources/css/app.css

@@ -4,13 +4,26 @@
 
 @import 'extends/grid.css';
 
+@import 'utilities.css';
 @import 'animations.css';
-@import 'fontfaces.css';
 
-@import 'components/buttons.css';
+@import 'typography/font-faces.css';
+@import 'typography/text-shadows.css';
+
+@import 'elements/buttons.css';
+@import 'elements/forms.css';
+@import 'elements/links.css';
+@import 'elements/pre-codes.css';
+@import 'elements/progress-bars.css';
+@import 'elements/tables.css';
+
+@import 'components/accordian-menus.css';
+@import 'components/alerts.css';
+@import 'components/breadcrumbs.css';
 @import 'components/cards.css';
-@import 'components/forms.css';
+@import 'components/modals.css';
-@import 'components/tables.css';
+@import 'components/navbars.css';
+@import 'components/pagination.css';
 
 body {
     min-height: 100vh;

src/resources/css/utilities.css

@@ -0,0 +1,3 @@
+.button-row {
+    @apply inline-grid grid-flow-col auto-cols-max items-center; /* intentionally leaving gap out so that it can be set on per-case basis */
+}

src/resources/js/app.js

@@ -1,14 +1,15 @@
 require("./bootstrap");
 
-import { createApp, h } from "vue";
+import { createApp, h } from 'vue';
-import { createInertiaApp } from "@inertiajs/inertia-vue3";
+import { createInertiaApp } from '@inertiajs/inertia-vue3';
-import { InertiaProgress } from "@inertiajs/progress";
+import { InertiaProgress } from '@inertiajs/progress';
-import Notifications from "notiwind";
+import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';
+import Notifications from 'notiwind';
 
-const appName = window.document.getElementsByTagName("title")[0]?.innerText || "Laravel";
+const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';
 
 window.genUid = function () {
-    return [...Array(16)].map(() => Math.floor(Math.random() * 16).toString(16)).join("");
+    return [...Array(16)].map(() => Math.floor(Math.random() * 16).toString(16)).join('');
 };
 
 createInertiaApp({
@@ -18,6 +19,7 @@ createInertiaApp({
         return createApp({ render: () => h(app, props) })
             .use(plugin)
             .use(Notifications)
+            .use(ZiggyVue, Ziggy)
             .mixin({ methods: { route } })
             .mount(el);
     },

src/resources/js/bootstrap.js

@@ -23,5 +23,9 @@ window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 //     broadcaster: 'pusher',
 //     key: process.env.MIX_PUSHER_APP_KEY,
 //     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
-//     forceTLS: true
+//     wsHost: import.meta.env.MIX_PUSHER_HOST ?? `ws-${import.meta.env.MIX_PUSHER_CLUSTER}.pusher.com`,
+//     wsPort: import.meta.env.MIX_PUSHER_PORT ?? 80,
+//     wssPort: import.meta.env.MIX_PUSHER_PORT ?? 443,
+//     forceTLS: (import.meta.env.MIX_PUSHER_SCHEME ?? 'https') === 'https',
+//     enabledTransports: ['ws', 'wss'],
 // });