fix: render loading spinner if no hash

app/[lang]/(preview)/preview/page.tsx

@@ -4,7 +4,7 @@ import { GetCurrentBlockPage } from "@/lib/graphql/Query/CurrentBlockPage.graphq
 import type { PageArgs, LangParams, UriParams } from "@/types/params"
 import type { GetCurrentBlockPageData } from "@/types/requests/currentBlockPage"
 import ContentstackLivePreview from "@contentstack/live-preview-utils"
-import LoadingPreview from "@/components/Current/LoadingPreview"
+import LoadingSpinner from "@/components/Current/LoadingSpinner"
 import ContentPage from "@/components/Current/ContentPage"
 
 export default async function CurrentContentPage({
@@ -14,8 +14,8 @@ export default async function CurrentContentPage({
   try {
     ContentstackLivePreview.setConfigFromParams(searchParams)
 
-    if (!searchParams.uri) {
-      return <LoadingPreview />
+    if (!searchParams.uri || !searchParams["live_preview"]) {
+      return <LoadingSpinner />
     }
 
     const response = await previewRequest<GetCurrentBlockPageData>(

components/Current/Aside.tsx

@@ -1,4 +1,5 @@
 import Puffs from "./Asides/Puffs"
+import Contact from "./Asides/Contacts"
 
 import { AsideTypenameEnum } from "@/types/requests/utils/typename"
 import type { AsideProps } from "@/types/components/current/aside"
@@ -14,7 +15,9 @@ export default function Aside({ blocks }: AsideProps) {
         const type = block.__typename
         switch (type) {
           case AsideTypenameEnum.CurrentBlocksPageAsideContact:
-            return null
+            return block.contact.contactConnection.edges.map((contact) => (
+              <Contact key={`contact-${idx}`} {...contact.node} />
+            ))
           case AsideTypenameEnum.CurrentBlocksPageAsidePuff:
             return <Puffs key={`block-${idx}`} puffs={block.puff.puffConnection.edges} />
           default:

components/Current/Blocks/List/list.module.css

@@ -1,11 +1,12 @@
 .title {
-    font-family: Helvetica, Arial, sans-serif;
+    font-family: BrandonText-Bold,Arial,Helvetica,sans-serif;
+    font-size: 1.375rem;
+    line-height: 1.1em;
+    text-transform: uppercase;
     font-weight: 400;
-    line-height: normal;
-    margin-top: 2rem;
+    color: #483729;
     margin-bottom: 1rem;
-    text-decoration: none;
-    text-transform: none;
+    margin-top: 2rem;
 }
 
 .ul {
@@ -60,6 +61,6 @@
 
 @media screen and (min-width: 950px) {
 .title {
-    font-size: 1.375rem;
+    font-size: 1.625rem;
   }
 }

components/Current/LoadingSpinner/index.tsx

@@ -1,6 +1,6 @@
 import styles from "./loading.module.css"
 
-export default function LoadingPreview() {
+export default function LoadingSpinner() {
   return (
     <div className={styles.container}>
       <div className={styles.spinner}>

components/Current/Section/section.module.css

@@ -6,7 +6,6 @@
   box-sizing: content-box;
   display: grid;
   gap: 70px;
-  grid-template-columns: 2fr 1fr;
   margin: 0 auto;
   max-width: 1200px;
   padding: 20px 10px 5px;
@@ -15,6 +14,7 @@
 @media screen and (min-width: 740px) {
   .section {
     padding: 30px 30px 15px;
+    grid-template-columns: 2fr 1fr;
   }
 }
 

types/components/current/asides/contact.ts

@@ -0,0 +1,3 @@
+import type { ContactNode } from "@/types/requests/asides/contact"
+
+export type ContactProps = ContactNode

types/requests/asides/contact.ts

@@ -1,23 +1,25 @@
 import type { Edges } from "../utils/edges"
 
+export type ContactNode = {
+  mailing_address: {
+    city: string
+    country: string
+    name: string
+    street: string
+    zip: string
+  }
+  phone: string
+  title: string
+  visiting_address: {
+    city: string
+    country: string
+    street: string
+    zip: string
+  }
+}
+
 export type Contact = {
   contact: {
-    contactConnection: Edges<{
-      mailing_address: {
-        city: string
-        country: string
-        name: string
-        street: string
-        zip: string
-      }
-      phone: string
-      title: string
-      visiting_address: {
-        city: string
-        country: string
-        street: string
-        zip: string
-      }
-    }>
+    contactConnection: Edges<ContactNode>
   }
 }