Next.js Discord

Discord Forum

How to name interfaces in TypesScript?

Answered
smene posted this in #help-forum
Open in Discord
I am facing into problems with naming Typescript interfaces for my Next.js + Mongoose + Typescript project.

I have models named: Customer which has username, password
But obviously the response from server cannot contain password, so I should have an interface for the Base model and an interface for every response, may you write your proposal so I could be insipired. Thank you :
Answered by B33fb0n3
I like to do something like this:
type EventBase = {
    displayName: string | undefined
}

type BoughtProductEvent = EventBase & {
    type: "product"
    boughtProductIds: string[]
}

type ExtendSubscriptionEvent = EventBase & {
    type: "subscription_extend"
    subscriptionCreationDate: number // stripe stores as timestamp in seconds example: `1714968973`
}

type BoughtMuchEvent = EventBase & {
    type: "much_products"
    amount: number
}


Like that I have one base (that all my Events contain) and the additional events can have their own paraemters. The type is then to get these fields. When I say inside a conditional statement, that I expect the type much_products I can also access the amount parameter typesafe.
View full answer

7 Replies

@smene I am facing into problems with naming Typescript interfaces for my Next.js + Mongoose + Typescript project. I have models named: Customer which has username, password But obviously the response from server cannot contain password, so I should have an interface for the Base model and an interface for every response, may you write your proposal so I could be insipired. Thank you :
I like to do something like this:
type EventBase = {
    displayName: string | undefined
}

type BoughtProductEvent = EventBase & {
    type: "product"
    boughtProductIds: string[]
}

type ExtendSubscriptionEvent = EventBase & {
    type: "subscription_extend"
    subscriptionCreationDate: number // stripe stores as timestamp in seconds example: `1714968973`
}

type BoughtMuchEvent = EventBase & {
    type: "much_products"
    amount: number
}


Like that I have one base (that all my Events contain) and the additional events can have their own paraemters. The type is then to get these fields. When I say inside a conditional statement, that I expect the type much_products I can also access the amount parameter typesafe.
Answer
thank you 🙂
@smene thank you 🙂
happy to help. Please mark solution
I'd like to wait for other proposals
Cinnamon
Another way which can be helpfu, is to leverage Partial<T>. It basically allows you say you're returning part of the Model T.

so in your case you have your customer model
type Customer = {
  username: string
  password: string
  name: string
}


then you can do
const loginResponse: Partial<Customer> = await login(...)


its a bit lazier than typing out every possible slice of Customer your app digests but its useful at times
yes Partial is a good option, but I sometimes need to add fields of values calculated at runtime so Partial couldn’t fit for my application