🎨 update error pages and fullwidth hero

Author: BorghildSelle

studio/sanity.config.tsx

@@ -69,9 +69,12 @@ const isPortableTextEditor = (schema: SchemaType) => {
 export const singletonTemplates = [
   'route_homepage',
   'newsroom',
+  'magazineIndex',
+  'settings',
+  //To be remove after upgrade
   'pageNotFound',
+  //To be remove after upgrade
   'internalServerError',
-  'magazineIndex',
 ]
 
 const handleInputComponents = (inputProps: InputProps) => {

studio/schemas/documents/404.ts

@@ -1,53 +1,12 @@
-import { collection_4, flight_land } from '@equinor/eds-icons'
-import type { PortableTextBlock, Rule } from 'sanity'
-import blocksToText from '../../helpers/blocksToText'
+import { collection_4 } from '@equinor/eds-icons'
 import { EdsIcon } from '../../icons'
-import { CompactBlockEditor } from '../components/CompactBlockEditor'
-import { configureBlockContent } from '../editors/blockContentType'
-import { lang } from './langField'
 
 export default {
   type: 'document',
-  title: `404 page`,
+  title: `Error pages`,
   name: `pageNotFound`,
   icon: () => EdsIcon(collection_4),
-  fieldsets: [
-    {
-      title: 'SEO & metadata',
-      name: 'metadata',
-      description:
-        'This part is used for meta information when this content is used on the web',
-      options: {
-        collapsible: true,
-        collapsed: true,
-      },
-    },
-  ],
   fields: [
-    lang,
-    {
-      title: 'Meta information',
-      name: 'seo',
-      type: 'titleAndMeta',
-      fieldset: 'metadata',
-    },
-    {
-      name: 'title',
-      type: 'array',
-      title: 'Title',
-      description: `Don't add the status code (404). The web will take care of that`,
-      components: {
-        input: CompactBlockEditor,
-      },
-      of: [configureBlockContent({ variant: 'title' })],
-      validation: (Rule: Rule) => Rule.required(),
-    },
-    {
-      title: 'Text',
-      name: 'text',
-      type: 'array',
-      of: [configureBlockContent({ variant: 'withH2SimpleBlock' })],
-    },
     {
       title: 'Background image',
       name: 'backgroundImage',
@@ -59,15 +18,12 @@ export default {
   ],
   preview: {
     select: {
-      title: 'title',
+      image: 'backgroundImage',
     },
-    prepare({ title }: { title: PortableTextBlock[] }) {
-      const plainTitle = title ? blocksToText(title) : ''
-
+    prepare({ image }: { image: any }) {
       return {
-        title: plainTitle,
-        subtitle: 'Page not found',
-        media: EdsIcon(flight_land),
+        title: 'Background image for error pages',
+        media: image,
       }
     },
   },

studio/schemas/documents/header/sharedHeaderFields.ts

@@ -153,6 +153,7 @@ const backgroundGradient = {
   title: 'Background Gradient',
   name: 'backgroundGradient',
   type: 'string',
+  fieldset: 'hero',
   description: 'Controls the gradient over semi-transparent background image.',
   initialValue: 'none', // default
   options: {

studio/schemas/documents/index.ts

@@ -20,13 +20,16 @@ import page from './page'
 import redirect from './redirect'
 import route from './route'
 import routeHomepage from './routeHomepage'
+import { settings } from './settings'
 import simpleMenu from './simpleMenu'
 import siteMenu from './siteMenu'
 import subMenu from './subMenu'
 import tag from './tag'
 
 export const documentsWithI18n = {
+  //To be remove after upgrade
   pageNotFound,
+  //To be remove after upgrade
   internalServerError,
   event,
   landingPage,
@@ -55,4 +58,5 @@ export default {
   magazineTag,
   route,
   subMenu,
+  settings,
 }

studio/schemas/documents/settings.tsx

@@ -0,0 +1,27 @@
+import { CogIcon } from '@sanity/icons'
+import { defineType } from 'sanity'
+
+export const settings = defineType({
+  name: 'settings',
+  title: 'Common settings',
+  type: 'document',
+  icon: CogIcon,
+  fields: [
+    {
+      title: 'Common error pages background image',
+      description: 'Will be used for 404 and 500 errors',
+      name: 'backgroundImage',
+      type: 'image',
+      options: {
+        hotspot: true,
+      },
+    },
+  ],
+  preview: {
+    prepare() {
+      return {
+        title: 'Common settings',
+      }
+    },
+  },
+})

studio/schemas/index.ts

@@ -130,6 +130,7 @@ const {
   siteMenu,
   simpleMenu,
   routeHomepage,
+  settings,
 } = documentSchemaTypes
 
 const routeSchemas = languages.map(({ name, title }) => {
@@ -157,6 +158,7 @@ const RemainingSchemas = [
   routeHomepage,
   pageNotFound,
   internalServerError,
+  settings,
   imageWithAlt,
   imageWithAltAndCaption,
   carouselImage,

studio/schemas/textSnippets.ts

@@ -28,6 +28,7 @@ export const groups = {
   carousel: { title: 'Carousel' },
   others: { title: 'Others' },
   common: { title: 'Common' },
+  error: { title: 'Error' },
 }
 const snippets: textSnippet = {
   country_code_format: {
@@ -922,6 +923,38 @@ const snippets: textSnippet = {
     defaultValue: 'Key figures',
     group: groups.common,
   },
+  serverErrorTitle: {
+    title: 'Server error title',
+    defaultValue: 'Something has happened',
+    group: groups.error,
+  },
+  serverErrorSubtitle: {
+    title: 'Server error subtitle',
+    defaultValue: 'We are sorry!',
+    group: groups.error,
+  },
+  serverErrorContent: {
+    title: 'Server error content',
+    defaultValue:
+      'Our site encountered some problem, please navigate back to our frontpage',
+    group: groups.error,
+  },
+  notFoundErrorTitle: {
+    title: 'Not found error title',
+    defaultValue: 'You have wandered into unknown territory',
+    group: groups.error,
+  },
+  notFoundErrorSubtitle: {
+    title: 'Not found error subtitle',
+    defaultValue: 'We love the curiosity!',
+    group: groups.error,
+  },
+  notFoundErrorContent: {
+    title: 'Not found error content',
+    defaultValue:
+      'But this page could not be found, please navigate back to our frontpage',
+    group: groups.error,
+  },
 }
 
 type textSnippetGroup = { title: string; hidden?: boolean }

studio/src/lib/structure/items/ErrorPages.js

@@ -3,17 +3,9 @@ import { FileIcon } from '../../../../icons'
 import { singletonListItem } from './SingletonItem'
 
 const miscPages = S =>
-  [
-    singletonListItem(S, 'pageNotFound', '404 - Page not found').icon(FileIcon),
-    singletonListItem(
-      S,
-      'internalServerError',
-      '500 - Internal server error',
-    ).icon(FileIcon),
-    /*     Flags.HAS_NEWSROOM &&
-      singletonListItem(S, 'newsroom', 'Newsroom').icon(NewsDocuments), */
-    /*     Flags.HAS_MAGAZINE_INDEX && singletonListItem(S, 'magazineIndex', 'Magazine Index').icon(NewsDocuments), */
-  ].filter(e => e)
+  [singletonListItem(S, 'settings', 'Common settings').icon(FileIcon)].filter(
+    e => e,
+  )
 
 export const Misc = S =>
   S.listItem()

studio/src/lib/structure/items/Misc.js

@@ -2,7 +2,7 @@ import { notFound } from 'next/navigation'
 import { hasLocale } from 'next-intl'
 import { routing } from '@/i18n/routing'
 import Footer from '@/sections/Footer/Footer'
-import Header from '@/sections/Header/Header'
+import Header from '@/sections/Header/HeaderBar'
 import { FriendlyCaptchaSdkWrapper } from '../FriendlyCaptchaWrapper'
 
 type Params = Promise<{ locale: string }>