refactor(#285): Replace While with Switch in walkSchemaTypes, Address…

… Various PR Comments

Co-Authored-By: Carol Soliman <17387510+carsoli@users.noreply.github.com>

packages/documentation/components/NavBar.vue

@@ -17,7 +17,6 @@
 <script lang="ts">
 import { Kotti } from '@3yourmind/kotti-ui'
 import { defineComponent, ref } from '@vue/composition-api'
-import { Route } from 'vue-router'
 
 import navLogo from '../assets/img/nav_logo.svg'
 import { menu } from '../data/menu'
@@ -44,6 +43,7 @@ export default defineComponent({
 	setup() {
 		const route = useRoute()
 		const router = useRouter()
+
 		const isNarrow = ref<boolean>(
 			(() => {
 				try {
@@ -62,8 +62,8 @@ export default defineComponent({
 		)
 
 		return {
-			handleLinkClick(link: Route) {
-				router.value.push(link.path)
+			handleLinkClick(link: Kotti.Navbar.SectionLink & { to: string }) {
+				router.value.push(link.to)
 			},
 			isNarrow,
 			navLogo,
@@ -87,17 +87,21 @@ export default defineComponent({
 			],
 			sections: menu.map(
 				(section): Kotti.Navbar.Section => ({
-					links: section.subsections.map((subsection) => ({
-						icon: subsection.icon,
-						title: subsection.title,
-						path: `/${subsection.path}${
-							subsection.pages.length >= 1 ? `/${subsection.pages[0].path}` : ''
-						}`,
-						isActive:
-							subsection.path === ''
-								? route.value.path === '/'
-								: route.value.path.startsWith(`/${subsection.path}`),
-					})),
+					links: section.subsections.map(
+						(subsection): Kotti.Navbar.SectionLink & { to: string } => ({
+							icon: subsection.icon,
+							isActive:
+								subsection.path === ''
+									? route.value.path === '/'
+									: route.value.path.startsWith(`/${subsection.path}`),
+							title: subsection.title,
+							to: `/${subsection.path}${
+								subsection.pages.length >= 1
+									? `/${subsection.pages[0].path}`
+									: ''
+							}`,
+						}),
+					) as unknown as Kotti.Navbar.Section['links'], // TS doesn’t understand the non-empty arrays without the cast due to the .map
 					title: section.title,
 				}),
 			),

packages/kotti-ui/source/kotti-breadcrumb/types.ts

@@ -29,10 +29,13 @@ export namespace KottiBreadcrumb {
 
 	export const propsSchema = z.object({
 		breadcrumbs: z.array(breadcrumbSchema),
-		separator: separatorSchema.default(() => ({
-			style: SeparatorType.ICON as const,
-			value: Yoco.Icon.CHEVRON_RIGHT,
-		})),
+		separator: separatorSchema.default(
+			() =>
+				({
+					style: SeparatorType.ICON,
+					value: Yoco.Icon.CHEVRON_RIGHT,
+				} as const),
+		),
 	})
 
 	export type PropsInternal = z.output<typeof propsSchema>

packages/kotti-ui/source/kotti-navbar/types.ts

@@ -15,17 +15,19 @@ export namespace KottiNavbar {
 	})
 	export type QuickLink = z.infer<typeof quickLinkSchema>
 
-	export const sectionLinkSchema = z.object({
-		icon: yocoIconSchema,
-		isActive: z.boolean(),
-		title: z.string(),
-		to: z.unknown().optional(),
-	})
+	export const sectionLinkSchema = z
+		.object({
+			icon: yocoIconSchema,
+			isActive: z.boolean(),
+			link: z.string().optional(),
+			title: z.string(),
+		})
+		.passthrough()
 	export type SectionLink = z.infer<typeof sectionLinkSchema>
 
 	export const sectionSchema = z.object({
+		links: z.array(sectionLinkSchema).nonempty(),
 		title: z.string().nullable(),
-		links: z.array(sectionLinkSchema),
 	})
 	export type Section = z.infer<typeof sectionSchema>
 
@@ -41,7 +43,7 @@ export namespace KottiNavbar {
 		logoUrl: z.string(),
 		notification: notificationSchema.nullable().default(null),
 		quickLinks: z.array(quickLinkSchema).default(() => []),
-		sections: z.array(sectionSchema),
+		sections: z.array(sectionSchema).nonempty(),
 		theme: themeSchema.nullable().default(null),
 	})
 

packages/kotti-ui/source/kotti-user-menu/types.ts

@@ -1,9 +1,12 @@
 import { z } from 'zod'
 
 export namespace KottiUserMenu {
-	export const sectionLinkSchema = z.object({
-		title: z.string(),
-	})
+	export const sectionLinkSchema = z
+		.object({
+			link: z.string().optional(),
+			title: z.string(),
+		})
+		.passthrough()
 	export type SectionLink = z.infer<typeof sectionLinkSchema>
 
 	export const sectionSchema = z.object({
@@ -14,7 +17,7 @@ export namespace KottiUserMenu {
 	export type Section = z.infer<typeof sectionSchema>
 
 	export const propsSchema = z.object({
-		sections: z.array(sectionSchema),
+		sections: z.array(sectionSchema).nonempty(),
 		userAvatar: z.string().nullable().default(null),
 		userName: z.string().nullable().default(null),
 		userStatus: z.string(),