feat: connect page data

opengovsg · Jun 25, 2024 · d091893 · d091893
1 parent 3985d60
commit d091893
Show file tree

Hide file tree

Showing 5 changed files with 82 additions and 11 deletions.
diff --git a/apps/studio/prisma/seed.ts b/apps/studio/prisma/seed.ts
@@ -11,6 +11,63 @@ import {
 } from '~/server/modules/resource/resource.types'
 import { db } from '../src/server/modules/database'
 
+const PAGE_BLOB = {
+  version: '0.1.0',
+  layout: 'homepage',
+  page: {
+    title: 'Home',
+  },
+  content: [
+    {
+      type: 'hero',
+      variant: 'gradient',
+      alignment: 'left',
+      backgroundColor: 'black',
+      title: 'Ministry of Trade and Industry',
+      subtitle:
+        'A leading global city of enterprise and talent, a vibrant nation of innovation and opportunity',
+      buttonLabel: 'Main CTA',
+      buttonUrl: '/',
+      secondaryButtonLabel: 'Sub CTA',
+      secondaryButtonUrl: '/',
+      backgroundUrl: 'https://ohno.isomer.gov.sg/images/hero-banner.png',
+    },
+    {
+      type: 'infobar',
+      title: 'This is an infobar',
+      description: 'This is the description that goes into the Infobar section',
+    },
+    {
+      type: 'infopic',
+      title: 'This is an infopic',
+      description: 'This is the description for the infopic component',
+      imageSrc: 'https://placehold.co/600x400',
+    },
+    {
+      type: 'keystatistics',
+      statistics: [
+        {
+          label: 'Average all nighters pulled in a typical calendar month',
+          value: '3',
+        },
+        {
+          label: 'Growth in tasks assigned Q4 2024 (YoY)',
+          value: '+12.2%',
+        },
+        {
+          label: 'Creative blocks met per single evening',
+          value: '89',
+        },
+        {
+          value: '4.0',
+          label: 'Number of lies in this stat block',
+        },
+      ],
+      variant: 'top',
+      title: 'Irrationality in numbers',
+    },
+  ],
+}
 const NAV_BAR_ITEMS = [
   {
     name: 'Expandable nav item',
@@ -79,7 +136,7 @@ const FOOTER_ITEMS = [
 ]
 
 async function main() {
-  const { id } = await db
+  const { id: siteId } = await db
     .insertInto('Site')
     .values({
       name: 'Ministry of Trade and Industry',
@@ -102,7 +159,7 @@ async function main() {
   await db
     .insertInto('Footer')
     .values({
-      siteId: id,
+      siteId,
       content: {
         contactUsLink: '/contact-us',
         feedbackFormLink: 'https://www.form.gov.sg',
@@ -116,10 +173,21 @@ async function main() {
   await db
     .insertInto('Navbar')
     .values({
-      siteId: id,
+      siteId,
       content: { items: NAV_BAR_ITEMS } satisfies Navbar,
     })
     .execute()
+
+  const { id: blobId } = await db
+    .insertInto('Blob')
+    .values({ content: PAGE_BLOB })
+    .returning('id')
+    .executeTakeFirstOrThrow()
+
+  await db
+    .insertInto('Resource')
+    .values({ blobId, name: 'Home', siteId })
+    .executeTakeFirstOrThrow()
 }
 
 main()

diff --git a/apps/studio/src/features/editing-experience/components/Preview.tsx b/apps/studio/src/features/editing-experience/components/Preview.tsx
@@ -23,6 +23,9 @@ export default function Preview({ schema }: PreviewProps) {
   const [{ content: navbar }] = trpc.site.getNavbar.useSuspenseQuery({
     id: 1,
   })
+  const [data] = trpc.page.readPageAndBlob.useSuspenseQuery({
+    pageId: 1,
+  })
 
   return (
     <RenderEngine

diff --git a/apps/studio/src/schemas/page.ts b/apps/studio/src/schemas/page.ts
@@ -4,7 +4,6 @@ const PAGE_LAYOUTS = ['content'] as const
 
 export const getEditPageSchema = z.object({
   pageId: z.number().min(1),
-  siteId: z.number().min(1),
 })
 
 export const updatePageSchema = getEditPageSchema.extend({

diff --git a/apps/studio/src/server/modules/page/page.router.ts b/apps/studio/src/server/modules/page/page.router.ts
@@ -16,13 +16,13 @@ export const pageRouter = router({
   readPageAndBlob: protectedProcedure
     .input(getEditPageSchema)
     .query(async ({ input, ctx }) => {
-      const { pageId, siteId } = input
+      const { pageId } = input
       const page = await getFullPageById(pageId)
       // TODO: Fill these in later
       const pageName: string = page.name
-      const siteMeta = getSiteConfig(siteId)
-      const navbar = getNavBar(siteId)
-      const footer = getFooter(siteId)
+      const siteMeta = getSiteConfig(page.siteId)
+      const navbar = getNavBar(page.siteId)
+      const footer = getFooter(page.siteId)
       const { content } = page
 
       return {

diff --git a/apps/studio/src/server/modules/resource/resource.service.ts b/apps/studio/src/server/modules/resource/resource.service.ts
@@ -21,13 +21,14 @@ export const getFolders = () =>
     .execute()
 
 // NOTE: Base method for retrieving a resource - no distinction made on whether `blobId` exists
-const getById = (id: number) => db.selectFrom('Resource').where('id', '=', id)
+const getById = (id: number) =>
+  db.selectFrom('Resource').where('Resource.id', '=', id)
 
 // NOTE: Throw here to fail early if our invariant that a page has a `blobId` is violated
 export const getFullPageById = (id: number) => {
   return getById(id)
-    .where('blobId', '!=', null)
-    .innerJoin('Blob', 'blobId', 'Blob.id')
+    .where('Resource.blobId', 'is not', null)
+    .innerJoin('Blob', 'Resource.blobId', 'Blob.id')
     .selectAll()
     .executeTakeFirstOrThrow()
 }