From 4b6f8a4be2f71340788640510c6894192719c3ec Mon Sep 17 00:00:00 2001
From: "Malin J." <millianapia@gmail.com>
Date: Mon, 27 Jan 2025 12:18:53 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8Introduce=20singlecolumn=20option=20fo?=
 =?UTF-8?q?r=20news=20#2772?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 sanityv3/schemas/objects/factbox.tsx                      | 8 +++++++-
 web/components/src/Fact/index.ts                          | 3 ---
 .../shared/portableText/components/news/Fact.tsx          | 5 +++--
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/sanityv3/schemas/objects/factbox.tsx b/sanityv3/schemas/objects/factbox.tsx
index 23e2191b3..375db22aa 100644
--- a/sanityv3/schemas/objects/factbox.tsx
+++ b/sanityv3/schemas/objects/factbox.tsx
@@ -54,6 +54,12 @@ export default {
       type: 'array',
       of: [blockContentType],
     },
+    {
+      name: 'isSingleColumn',
+      type: 'boolean',
+      title: 'Single column layout',
+      description: 'Toggle to use a single-column layout instead of the default two-column layout. This will have no effect if image is selected',
+     },
     {
       name: 'image',
       title: 'Image',
@@ -108,4 +114,4 @@ export default {
       }
     },
   },
-}
+}
\ No newline at end of file
diff --git a/web/components/src/Fact/index.ts b/web/components/src/Fact/index.ts
index d769e4187..5752b848b 100644
--- a/web/components/src/Fact/index.ts
+++ b/web/components/src/Fact/index.ts
@@ -4,9 +4,6 @@ import { Image } from './Image'
 import { Content } from './Content'
 
 export type FactImagePosition = 'left' | 'right'
-// @TODO: Color mapping must be more generic than this!!!
-// Find a better way to do this.
-// Create a proper type for colors
 
 type FactBoxCompoundProps = typeof FactBoxWrapper & {
   Image: typeof Image
diff --git a/web/pageComponents/shared/portableText/components/news/Fact.tsx b/web/pageComponents/shared/portableText/components/news/Fact.tsx
index 6d56ecd36..4f8b790ed 100644
--- a/web/pageComponents/shared/portableText/components/news/Fact.tsx
+++ b/web/pageComponents/shared/portableText/components/news/Fact.tsx
@@ -15,6 +15,7 @@ type FactboxProps = {
   image: ImageWithAlt
   imagePosition: FactImagePosition
   dynamicHeight: boolean
+  isSingleColumn?: boolean
 }
 
 type BlockProps = {
@@ -25,7 +26,7 @@ type BlockProps = {
 
 export const Fact = (block: BlockProps) => {
   const { value, className } = block
-  const { title, content, background, image, imagePosition, dynamicHeight } = value
+  const { title, content, background, image, imagePosition, dynamicHeight, isSingleColumn } = value
 
   const bgTitle = (background ? background?.title : 'White') as BackgroundColours
   if (!content || content.length === 0) {
@@ -36,7 +37,7 @@ export const Fact = (block: BlockProps) => {
 
   const plainText = content ? toPlainText(content as PortableTextBlock[]) : ''
 
-  const hasColumns = !imageSrc && plainText.length > 800
+  const hasColumns = !imageSrc && !isSingleColumn && plainText.length > 800
   const hasImage = imageSrc ? true : false
   const hasBgColor = bgTitle !== 'White'