How to change typescript object type after adding new property

Question

I have a node application getServerSideProps function with context object. I need to add new properties or parce data of this object. Is there a way to change typescript object type with minimal use of any and js code change?

Sandbox.

// this type cannot be changed
type Complex = { very_complex_type: string}

// this type cannot be changed
type Req = {
  headers: Complex
  cookies: Complex
}

// this type cannot be changed
type Prisma = {
  db: Complex
}

type Ctx = Prisma & Req

// what type should i use for param, return and so on (without any if it can be done)
const ctxResolver = (ctx) => {
  ctx.db = { very_complex_type: 'smth'} // ctxResolver adds db property to ctx
}
    
const getServerSideProps = async (ctx: Req) => {
  ctxResolver(ctx)

  ctx // how to make it of type Req & Prisma
}

// Attempt 1
const ctxResolver1 = (ctx: Req): ctx is Ctx => {
  ((ctx as unknown) as Ctx).db = { very_complex_type: 'smth'} // to many type coversions
  return true
}

const getServerSideProps1 = (ctx: Req) => {
  if (!ctxResolver1(ctx)) return // i don't need if and return here

  ctx // ok
}

// Attempt 2
const ctxResolver2 = (ctx: Req): Ctx => {
  ((ctx as unknown) as Ctx).db = { very_complex_type: 'smth'} // to many type coversions
  
  return ctx as Ctx
}

const getServerSideProps2 = (_ctx: Req) => {
  const ctx = ctxResolver2(_ctx) // not sure if _ctx and ctx points to the same object in memory 

  ctx // ok
}

Anatoly · Accepted Answer · 2020-11-26 20:38:51Z

1

If you wish that ctxResolver only modifies props of an object passed as a param:

const ctxResolver = (ctx: Prisma): void => {
  ctx.db = { very_complex_type: 'smth'} // ctxResolver adds db property to ctx
}
    
const getServerSideProps = async (_ctx: Ctx) => {
  ctxResolver(_ctx)

  _ctx // it stays Ctx
}

answered Nov 26, 2020 at 20:38

Anatoly

23.2k3 gold badges33 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

ZiiMakc Over a year ago

better, but i was hoping to not trick typescript :(

Anatoly Over a year ago

That's not a trick. ctxResolver knows exactly only what it should know about ctx - db prop and that's all.

ZiiMakc Over a year ago

I oversimplified example, but ctxResolver also using data from Req. _ctx can be of two different types. _ctx is not of Ctx type, so it's feels wrong already, a hoped to change it step by step.

Anatoly Over a year ago

It'ok. Just unsimplify it a bit. I can remove my answer at the same time

Collectives™ on Stack Overflow

How to change typescript object type after adding new property

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related