Nenad Novakovic Posts - Answer Overflow

Nenad Novakovic

•Created by Nenad Novakovic on 6/20/2024 in #❓・help

Get return type from api route?

Is it possible to get the return type (assuming it's generated by Nuxt) so that I can use it as a type of something else? Fetch utils know about the return type, but I want to access it directly. How?

6 replies

NNuxt

•Created by Nenad Novakovic on 5/28/2024 in #❓・help

Does SelectMenu supports categorization?

Haven't gone in too deep, but I want to have a category label, then some items, then another category label and so on. It should act as a divider basically. Not sure if it's doable using slots, but no examples were shown with such logic. Checking tomorrow, but asking tonight - as someone may have something already!

2 replies

NNuxt

•Created by Nenad Novakovic on 5/27/2024 in #❓・help

Read files in API route, fails on Vercel

I have a simple API request that reads some dirs and files and creates a response out of it. In the Vercel's docs, I read that I have to use process.cwd() but that does not help.

// api/presets.get.ts
import fs from 'node:fs/promises'
import path from 'node:path'

export default defineEventHandler(async (event) => {
  const dir = path.join(process.cwd(), 'public', 'presets', 'front', 'us')
  const files = await fs.readdir(dir)

  return files
})

// api/presets.get.ts
import fs from 'node:fs/promises'
import path from 'node:path'

export default defineEventHandler(async (event) => {
  const dir = path.join(process.cwd(), 'public', 'presets', 'front', 'us')
  const files = await fs.readdir(dir)

  return files
})

Previously, I had presets inside of a server directory, but that did not work on Vercel, so I moved it to the public. Obviously, hoped it would work, but it's the same. It cannot find the directory. I also read somewhere that Nuxt supports useStorage() to have server assets, but I do not think that's what I need here, or is it?

5 replies

NNuxt

•Created by Nenad Novakovic on 5/1/2024 in #❓・help

How to access Headless UI?

In Nuxt UI docs it states that it uses Headless UI as a dependency. How does one import some Headless UI components directly, because I want to build a custom component that's missing from UI library, using Headless UI RadioGroup component. Do I need to install it as project dependency? This is what I want, but I don't see it as available in Nuxt UI: https://tailwindui.com/components/application-ui/forms/radio-groups#component-245cb777f4a9823e97d8b1c2dfb87e0c

1 replies

NNuxt

•Created by Nenad Novakovic on 4/5/2024 in #❓・help

How to infer the type from `useAsyncData`?

I am getting a list of products through api endpoint. Using useAsyncData it knows what it will be returning, which is great! However, I want to know which product is currently being viewed/selected and I want to give that ref a type that is infered from this data.

const selectedProduct = shallowRef<typeof products.value>()
const { data: products } = await useAsyncData('products', () =>
  $fetch('/api/products'),
)

const selectedProduct = shallowRef<typeof products.value>()
const { data: products } = await useAsyncData('products', () =>
  $fetch('/api/products'),
)

Here's the thing tho, I want to make that type a single item, not an array of items. But I have no ideas how to unwrap this infered type from Simplify and SerializeObject.

const selectedProduct: ShallowRef<Simplify<SerializeObject<{
    id: number;
    price: number;
    checkoutId: string | undefined;
    recurrence: string;
    label: string;
    description: string;
}>[] | undefined> | null>

const selectedProduct: ShallowRef<Simplify<SerializeObject<{
    id: number;
    price: number;
    checkoutId: string | undefined;
    recurrence: string;
    label: string;
    description: string;
}>[] | undefined> | null>

Help is greatly appreciated!

8 replies

Gaming

Programming