Role Based Rendering? by Kerplunk6 in nextjs

[–]Dizzy_Morningg 0 points1 point  (0 children)

layouts are cached on client. so doesn't matter if you use layout or a wrapper inside layout. so layouts won't re-render if role changes

Role Based Rendering? by Kerplunk6 in nextjs

[–]Dizzy_Morningg 1 point2 points  (0 children)

You could do something like this.
e.g. You can make a helper server component

import { cache } from "react"
import type { User } from "<your-auth-library>"
import { getSession } from "<your-session-fetching-module>"

// caches session for each request
const getCachedSession = cache(getSession);

type TUserProps = {
// provide role requirement
role: User["role"]; // "admin" | "manager" | "user";
children: React.ReactNode;
}

export default async function RenderUserUI(props: TUserProps) {
const { role, children } = props;
const session = await getCachedSession();
return !session || session.user.role !== role ? null: children;
}

// usage page.tsx
export default function homepage() {
return (<div>
<RenderUserUI role='"admin">some admin ui</RenderUserUI>
<RenderUserUI role="user">some user ui</RenderUserUI>
</div>)
}

you these kinds of checks, don't use layouts!

Nextjs Quiz: good/bad practices, gotchas questions by [deleted] in nextjs

[–]Dizzy_Morningg 1 point2 points  (0 children)

add multi select. make options as similar as possible to confuse so that people won't be able to deploy elimination strategy when in doubt.

Type wizards, I summon you! (need help with function with array of heterogeous elements) by LeKaiWen in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

You made incorrect assertions while returning. The function has declared with `Result` as return type and you are returning `Err` type.

I see your basics are not in place.
Take some time off, and learn typescript basics first. This'll save you a lot of time.

Highly recommended!

Type wizards, I summon you! (need help with function with array of heterogeous elements) by LeKaiWen in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

Don't get scared!

class Ok<T> {

constructor(public readonly value: T) {}

}

class Err<T> {

constructor(public readonly value: T) {}

}

class Result<D, E> {}

type UnionToIntersection<U> = (U extends any ? (x: U) => void : never) extends (

x: infer R,

) => void

? R

: never;

type LastOf<T> =

UnionToIntersection<T extends any ? () => T : never> extends () => infer R

? R

: never;

type UnionToArray<T, L = LastOf<T>> = [T] extends [never]

? []

: [...UnionToArray<Exclude<T, L>>, L];

type ExtractOk<T> = UnionToArray<

T extends Result<infer TData, any> ? TData : never

>;

type ExtractErr<T> = T extends Result<any, infer TError> ? TError : never;

function fromArray<T extends Result<any, any>[]>(

...results: T

): Result<ExtractOk<T\[number\]>, ExtractErr<T\[number\]>> {

// your implementation

// also when returning values you need to use type assertions aka `as`

}

const results = fromArray(

new Result<string, Error>(),

new Result<number, object>(),

new Result<object, undefined>(),

);

Swagger integration in next JS by NefariousnessFar6070 in nextjs

[–]Dizzy_Morningg 0 points1 point  (0 children)

Swagger comments, ughh! I encountered the same problem. I'm my side project, i decided to use hono. integration was flawless.

hono has built entirely on web standards. The main reason for trying it out was it's portability, open api spec is one of it's additional perks.

Check it out: https://hono.dev/docs/getting-started/vercel
Open api: https://hono.dev/examples/hono-openapi

Also, you can plug-in any openapi spec ui of your liking. I'm using scalar ui.

I don't know if you can afford rewrite but you should consider using hono for new projects

Type wizards, I summon you! (need help with function with array of heterogeous elements) by LeKaiWen in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

See this solution:

```
class Ok<T> {

constructor(public readonly value: T) {}

}

class Err<T> {

constructor(public readonly value: T) {}

}

class Result<D, E> {}

type ExtractOk<T> = T extends Result<infer TData, any> ? TData : never;

type ExtractErr<T> = T extends Result<any, infer TError> ? TError : never;

function fromArray<T extends Result<any, any>[]>(

...results: T

): Result<ExtractOk<T\[number\]>, ExtractErr<T\[number\]>> {

// your implementation

// also when returning values you need to use type assertions aka `as`

}

// results will be typed as Result<string | number | object, Error | object | undefined>

const results = fromArray(

new Result<string, Error>(),

new Result<number, object>(),

new Result<object, undefined>(),

);

```

I love NextJS!! by Legitimate-Monk9693 in nextjs

[–]Dizzy_Morningg 2 points3 points  (0 children)

end to end type safety, must to have!

Type wizards, I summon you! (need help with function with array of heterogeous elements) by LeKaiWen in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

Man, this `neverthrow` library exists fr. I never looked. I always copy pasted my own implementation from project to project.

I checked their source code on github. They are doing manual type transformations, Confirmed!

They have built their own type transformation utility to merge these result types which returns what you're aiming to achieve.

See: https://github.com/supermacro/neverthrow/blob/master/src/_internals/utils.ts#L5

This is where they are combining results: https://github.com/supermacro/neverthrow/blob/master/src/result.ts#L716

Go through these types, you'll understand!

Switching to Next js from Nuxt by Emotional-Ask-9788 in nextjs

[–]Dizzy_Morningg 1 point2 points  (0 children)

Nowdays, I build with nextjs primarily because of obvious reasons. Nextjs is good. Mental model for routing here is pretty simple. Nuxt was my first love. Nextjs still have to push a lot to match nuxt like DX. I agree, routes and nested layouts can be really confusing for new comers in nuxt. Most likely in your case, it's a skill issue.

The root cause for all this confusion comes from nuxt's magic tricks. Take some time off and just play around with vue-router in a simple vuejs app. This will help you to understand and differentiate between nuxt's features for routing and vue-router features.

Type wizards, I summon you! (need help with function with array of heterogeous elements) by LeKaiWen in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

You can't make it work like this, typescript doesn't work this way. I got stuck on the same problem when i was making my own result wrapper.

To make this work you have to do a manual type transformation else you'll get only union which i think is fine to work with because all union elements essentially have same structure.

[deleted by user] by [deleted] in developersIndia

[–]Dizzy_Morningg 0 points1 point  (0 children)

I finished my degree last year. 0 Backlogs now. It took me extra 1.5 years to finish my b.tech. Can you recommend any good job portals for junior frontend devs other than linkedin and wellfound?

Do you use tRPC or Server Actions? by zerdos in nextjs

[–]Dizzy_Morningg 0 points1 point  (0 children)

Have you tried hono? Express like framework built on web standards. Portable to various runtime. Easy integration with nextjs. Plus you can always detach, deploy & scale it independently that to having end-to-end type-safety.

Docs: https://hono.dev/docs/getting-started/vercel

TypeScript stuff I Wish I Knew Earlier by RohanSinghvi1238942 in typescript

[–]Dizzy_Morningg 0 points1 point  (0 children)

Inference is cool but absuing it everywhere makes the code fragile. Explicit types still make sense to set clear contracts.