refactor: update config and scripts to ensure production mode (#1122)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Refactor**
- Updated the user profile’s loading indicator for a smoother visual
experience during system restart.
- **Chores**
- Improved environment-specific configurations and asset management,
streamlining production builds and deployment.
	- Enhanced the development tools behavior based on the environment.
- Updated scripts for building and serving the application to align with
production settings.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>

web/components/UserProfile/DropdownLaunchpad.vue

@@ -1,8 +1,9 @@
 <script lang="ts" setup>
-import { BrandButton, BrandLoadingWhite } from '@unraid/ui';
+import { BrandButton, BrandLoading } from '@unraid/ui';
 import { useServerStore } from '~/store/server';
 import { useUnraidApiStore } from '~/store/unraidApi';
 import { storeToRefs } from 'pinia';
+import { h } from 'vue';
 import type { ComposerTranslation } from 'vue-i18n';
 
 defineProps<{ t: ComposerTranslation }>();
@@ -34,7 +35,11 @@ const showExpireTime = computed(
           <BrandButton
             class="w-full"
             :disabled="unraidApiStatus === 'connecting' || unraidApiStatus === 'restarting'"
-            :icon="unraidApiStatus === 'restarting' ? BrandLoadingWhite : unraidApiRestartAction?.icon"
+            :icon="
+              unraidApiStatus === 'restarting'
+                ? h(BrandLoading, { variant: 'white' })
+                : unraidApiRestartAction?.icon
+            "
             :text="
               unraidApiStatus === 'restarting' ? t('Restarting unraid-api…') : t('Restart unraid-api')
             "

web/nuxt.config.ts

@@ -47,7 +47,7 @@ export default defineNuxtConfig({
   },
 
   devtools: {
-    enabled: true,
+    enabled: process.env.NODE_ENV === 'development',
   },
 
   modules: [
@@ -87,6 +87,10 @@ export default defineNuxtConfig({
           includes: ['log', 'info', 'debug'],
         }),
     ],
+    define: {
+      'globalThis.__DEV__': process.env.NODE_ENV === 'development',
+      __VUE_PROD_DEVTOOLS__: false,
+    },
     build: {
       minify: 'terser',
       terserOptions: {
@@ -151,8 +155,9 @@ export default defineNuxtConfig({
             name: 'UnraidWelcomeModal',
             path: '@/components/WelcomeModal.ce',
           },
-          { name: 'UnraidSsoButton', 
-            path: '@/components/SsoButton.ce' 
+          {
+            name: 'UnraidSsoButton',
+            path: '@/components/SsoButton.ce',
           },
         ],
       },

web/package.json

@@ -13,14 +13,14 @@
     "prebuild:webgui": "./scripts/prebuild-webgui-set-env.sh",
     "build:webgui": "npm run type-check && nuxt build && npm run manifest-ts && npm run copy-to-webgui-repo",
     "postbuild:webgui": "./scripts/postbuild-webgui-restore-env.sh",
-    "build": "npm run type-check && nuxt build && npm run manifest-ts",
+    "build": "NODE_ENV=production npm run type-check && nuxt build && npm run manifest-ts",
     "deploy-to-unraid:dev": "./scripts/deploy-dev.sh",
     "copy-to-webgui-repo": "./scripts/copy-to-webgui-repo.sh",
     "manifest-ts": "node ./scripts/add-timestamp-webcomponent-manifest.js",
     "generate": "nuxt generate",
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare",
-    "serve": "serve dist/nuxt-custom-elements/unraid-components",
+    "serve": "NODE_ENV=production PORT=${PORT:-4321} node .output/server/index.mjs",
     "codegen": "graphql-codegen --config codegen.ts -r dotenv/config",
     "codegen:watch": "graphql-codegen --config codegen.ts --watch -r dotenv/config",
     "test": "vitest",