simple button

.dockerignore

@@ -0,0 +1,4 @@
+node_modules
+.git
+.nuxt
+.idea

app/components/dashboard/sidebar.vue

@@ -3,7 +3,7 @@ import type { NavigationMenuItem } from '@nuxt/ui'
 //import Logo from '@nuxt/ui'
 
 
-const items: NavigationMenuItem[][] = [
+const items_def: NavigationMenuItem[][] = [
 [{
   label: 'Home',
   icon: 'i-lucide-house',
@@ -37,13 +37,20 @@ const items: NavigationMenuItem[][] = [
   to: 'https://github.com/nuxt/ui',
   target: '_blank'
 }]]
+
+const props = defineProps<{
+  items? : NavigationMenuItem[][]
+}>()
+
+const items: NavigationMenuItem[][] = props.items ?? items_def;
 </script>
 
 
 <template>
-  <UDashboardSidebar collapsed resizable :ui="{ footer: 'border-t border-default' }">
+
+  <UDashboardSidebar collapsible resizable :ui="{ footer: 'border-t border-default' }">
     <template #header="{ collapsed }">
-      <UIcon v-if="!collapsed" name="i-simple-icons-nuxtdotjs" class="h-5 w-auto shrink-0" />
+      <AppLogo icon="i-simple-icons-nuxtdotjs" text="Nuxt" v-if="!collapsed" name="i-simple-icons-nuxtdotjs" class="h-5 w-auto shrink-0" />
       <UIcon v-else name="i-simple-icons-nuxtdotjs" class="size-5 text-primary mx-auto" />
     </template>
 

app/layouts/dashboard.vue

@@ -1,11 +1,33 @@
+<script setup lang="ts">
+import type { NavigationMenuItem } from '@nuxt/ui'
+
+const nav : NavigationMenuItem[][] = [[
+  {
+  label: 'Home',
+  icon: 'i-lucide-house',
+  active: true,
+  to: "/dashboard"
+}, {
+  label: 'Inbox',
+  icon: 'i-lucide-inbox',
+  badge: '4',
+  to: "/inbox"
+}, {
+  label: 'Contacts',
+  icon: 'i-lucide-users',
+  to: "/inbox"
+}]];
+/*[
+  {
+    label: "Feedback"
+  }
+]];*/
+</script>
 <template>
   <UDashboardGroup>
-    <DashboardSidebar />
+    <DashboardSidebar collapsible resizable :items="nav"/>
-    
     <UDashboardSidebarCollapse />
 
-    
-
     <slot />
   </UDashboardGroup>
 </template>

app/pages/dashboard.vue

@@ -27,9 +27,10 @@
 
 <template>
   <UContainer>
-    <UDashboardSidebarToggle variant="subtle" />
     
-    <div class="mt-1 mb-2 flex flex-col w-full">
+    <UDashboardSidebarToggle variant="subtle" class="absolute z-20 top-3 left-2.5"/>
+
+    <div class="mt-1 mb-2 flex flex-col w-full relative z-0">
       <ProseH2 class="text-center m-0.5 w-full">Hey there, user!</ProseH2>
       <ProseP class="text-center text-muted m-0.5">Welcome to the UI!</ProseP>
       <UBadge variant="subtle" class="inline mx-auto">It's cool, isn't it ?</UBadge> 

app/pages/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="flex flex-col">
+    <UButton
+      to="/dashboard"
+      target="_self"
+      variant="outline"
+      class="mx-auto mt-5">Go to dashboard
+  
+    </UButton>
+  </div>
+</template>
+
+<script lang="js">
+
+</script>
+
+<style>
+
+</style>

dockerfile

@@ -1,13 +1,34 @@
-# Use the lightweight node
+FROM node:22-alpine AS build
-FROM node:22-alpine
-
 WORKDIR /app
-COPY .output .
 
+#RUN corepack enable
+
+# Copy package.json
+COPY package.json .
+
+# Install dependencies
+RUN npm i --prod
+
+# Copy the entire project
+COPY . ./
+
+# Build the project
+RUN npm run build
+
+# Build Stage 2
+
+FROM node:22-alpine
+WORKDIR /app
+
+# Only `.output` folder is needed from the build stage
+COPY --from=build /app/.output/ ./
+
+# Change the port and host
 ENV PORT=3000
 ENV HOST=0.0.0.0
 
-VOLUME ["/app"]
+EXPOSE 3000
 
-CMD ["node","server/index.mjs"]
+VOLUME [ "/app" ]
 
+CMD ["node", "/app/server/index.mjs"]