Thanks for the contribution @npenza!

Two things to consider:

1. I'm wondering why we can't use the Link component that Wasp exports since most (all?) of these links are routes defined in the main.wasp file and could benefit from its typesafety feature. Did you try it out and run into any issues?
2. We also need to update the landing page, as it has its own, separate "nav bar" in src/landing-page/components/Header.tsx.

Edit:

Maybe this might be a nice solution, or am I forcing the use of Wasp's Link component here? WDYT @infomiho ?

import { Link, routes, type Routes } from 'wasp/client/router';
//...

interface NavigationItem {
  name: string
  href: Routes['to']
}
const navigation: NavigationItem[] = [
  { name: 'AI Scheduler (Demo App)', href: '/demo-app'}, // because we typed it, we get autocompleted routes here based on our main.wasp file
  { name: 'File Upload (AWS S3)', href: '/file-upload' },
  { name: 'Pricing', href: '/pricing' },
];

Thanks @vincanger. We definitely can use Wasp's Link component.

Before I make the changes, can you please clarify the differences between .build() and .to for the route objects? E.g this works:

const navigation = [
  { name: 'AI Scheduler (Demo App)', href: routes.DemoAppRoute.to },
  { name: 'File Upload (AWS S3)', href: routes.FileUploadRoute.to },
  { name: 'Pricing', href: routes.PricingPageRoute.to },
];

But this causes a ts error 'Type 'string' is not assignable to type' when mapping through navigation.

const navigation = [
  { name: 'AI Scheduler (Demo App)', href: routes.DemoAppRoute.build() },
  { name: 'File Upload (AWS S3)', href: routes.FileUploadRoute.build() },
  { name: 'Pricing', href: routes.PricingPageRoute.build() },
];

@npenza check out the proposed solution I gave above. The Wasp Link component expects a type which is a union of the route strings, so it functions more like an enum. That's why it won’t accept a general string, which is the error you referenced. The reason the build method throws this error is because it’s typed to return a string, which doesn’t match the union of route strings.