Lennox Posts - Answer Overflow

Lennox

•Created by Lennox on 3/27/2025 in #❓・help

Auth middleware not redirecting

I'm using nuxt-auth-utils and everything in my middleware works exept the redirect itself. I even get the "DUMMY REDIRECT" in the console. I've even tried with await, return, await return. abortNavigation() also does nothing. Why is that? auth.global.ts

export default defineNuxtRouteMiddleware((to, from) => {
  const { loggedIn } = useUserSession();

  watch(
    () => loggedIn.value,
    (isLoggedIn) => {
      console.log("AUTH MIDDLEWARE", isLoggedIn);

      if (!isLoggedIn) {
        console.log("DUMMY REDIRECT");
        return abortNavigation();
        // navigateTo("/login");
        // navigateTo("/auth/microsoft", { external: true });
      }
    },
    { immediate: true } // Trigger the watcher immediately
  );
});

export default defineNuxtRouteMiddleware((to, from) => {
  const { loggedIn } = useUserSession();

  watch(
    () => loggedIn.value,
    (isLoggedIn) => {
      console.log("AUTH MIDDLEWARE", isLoggedIn);

      if (!isLoggedIn) {
        console.log("DUMMY REDIRECT");
        return abortNavigation();
        // navigateTo("/login");
        // navigateTo("/auth/microsoft", { external: true });
      }
    },
    { immediate: true } // Trigger the watcher immediately
  );
});

42 replies

NNuxt

•Created by Lennox on 3/25/2025 in #❓・help

Limit deployments

How can I make it so that nuxt hub only deploys the latest commit? I don't want/need anything old.

8 replies

NNuxt

•Created by Lennox on 3/13/2025 in #❓・help

Transition of drawer state

Hey, I want to make a Drawer that can have multiple states/menus. Example: First screen should be buttons of what to do (upload as pdf or png) and then it should switch to the new menu. Switching kind of works. But the size of the drawer doesn't animate but rather jumps around. how to fix? I'm using ui3

  <UDrawer
    should-scale-background
    title="Upload"
    description="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
    v-model:open="drawerOpenState"
  >
    <UButton
      icon="i-heroicons-plus"
      class="bottom-14 left-1/2 fixed shadow-sm rounded-full -translate-x-1/2 cursor-pointer transform"
      color="primary"
      size="xl"
      variant="solid"
    />

    <template #body>
      <div class="transition-all">
        <div key="menu-0" class="h-64" v-if="drawerMenuState === 0">
          <div class="w-1/2">
            <!-- file and submit -->
            <p @click="drawerMenuState = 1">
              Lorem ipsum dolor sit amet consectetur, adipisicing elit. Porro
              saepe suscipit aperiam! Hic architecto libero debitis similique!
              Eaque laudantium vero ab iusto? Ut dolores facilis illo molestias
              ex consequuntur vitae.
            </p>
          </div>
        </div>
        <div key="menu-1" class="h-32" v-else-if="drawerMenuState === 1">
          <div class="w-1/2">
            <!-- file and submit -->
            <p @click="drawerMenuState = 0">
              Lorem ipsum dolor sit amet consectetur, adipisicing elit. Porro
              saepe suscipit aperiam! Hic architecto libero debitis similique!
              Eaque laudantium vero ab iusto? Ut dolores facilis illo molestias
              ex consequuntur vitae.
            </p>
          </div>
        </div>
      </div>
    </template>
  </UDrawer>

  <UDrawer
    should-scale-background
    title="Upload"
    description="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
    v-model:open="drawerOpenState"
  >
    <UButton
      icon="i-heroicons-plus"
      class="bottom-14 left-1/2 fixed shadow-sm rounded-full -translate-x-1/2 cursor-pointer transform"
      color="primary"
      size="xl"
      variant="solid"
    />

    <template #body>
      <div class="transition-all">
        <div key="menu-0" class="h-64" v-if="drawerMenuState === 0">
          <div class="w-1/2">
            <!-- file and submit -->
            <p @click="drawerMenuState = 1">
              Lorem ipsum dolor sit amet consectetur, adipisicing elit. Porro
              saepe suscipit aperiam! Hic architecto libero debitis similique!
              Eaque laudantium vero ab iusto? Ut dolores facilis illo molestias
              ex consequuntur vitae.
            </p>
          </div>
        </div>
        <div key="menu-1" class="h-32" v-else-if="drawerMenuState === 1">
          <div class="w-1/2">
            <!-- file and submit -->
            <p @click="drawerMenuState = 0">
              Lorem ipsum dolor sit amet consectetur, adipisicing elit. Porro
              saepe suscipit aperiam! Hic architecto libero debitis similique!
              Eaque laudantium vero ab iusto? Ut dolores facilis illo molestias
              ex consequuntur vitae.
            </p>
          </div>
        </div>
      </div>
    </template>
  </UDrawer>

11 replies

NNuxt

•Created by Lennox on 3/12/2025 in #❓・help

Vite-PWA

I'm using vite-pwa but everytime i enable it in the dev options my nuxt devtools break. nuxt.config.ts (snippet)

pwa: {
    devOptions: {
      enabled: true,
    },
    manifest: {
      short_name: "XYZ",
      name: "XYZ",
      icons: [
        // {
        //   src: "apple-touch-icon.png",
        //   sizes: "180x180",
        //   type: "image/png",
        // },
        {
          src: "android-chrome-192x192.png",
          sizes: "192x192",
          type: "image/png",
        },
        {
          src: "android-chrome-512x512.png",
          sizes: "512x512",
          type: "image/png",
        },
      ],
      start_url: "/",
      display: "standalone",
      theme_color: "#7C86FF",
      background_color: "#171717",
    },
  },

pwa: {
    devOptions: {
      enabled: true,
    },
    manifest: {
      short_name: "XYZ",
      name: "XYZ",
      icons: [
        // {
        //   src: "apple-touch-icon.png",
        //   sizes: "180x180",
        //   type: "image/png",
        // },
        {
          src: "android-chrome-192x192.png",
          sizes: "192x192",
          type: "image/png",
        },
        {
          src: "android-chrome-512x512.png",
          sizes: "512x512",
          type: "image/png",
        },
      ],
      start_url: "/",
      display: "standalone",
      theme_color: "#7C86FF",
      background_color: "#171717",
    },
  },

layouts/default.vue

<template>
  <!-- MANIFEST -->
  <VitePwaManifest />
  <!-- END OF MANIFEST -->

  <!-- vaul-drawer-wrapper -->
  <UContainer class="px-8 py-16 min-h-screen">
    <slot />
  </UContainer>
</template>

<template>
  <!-- MANIFEST -->
  <VitePwaManifest />
  <!-- END OF MANIFEST -->

  <!-- vaul-drawer-wrapper -->
  <UContainer class="px-8 py-16 min-h-screen">
    <slot />
  </UContainer>
</template>

23 replies

NNuxt

•Created by Lennox on 3/11/2025 in #❓・help

GitHub Action - Deploy to NuxtHub

Everytime I push to my GitHub repo I get the following error from my action that's been automaticly created by NuxtHub. Why is that? (Full Actions Logs attatched)

10 replies

NNuxt

•Created by Lennox on 3/10/2025 in #❓・help

z-index glitch

12 replies

Gaming

Programming