Ok decent fallback with isExempt

src/components/ageAssurance/AgeRestrictedScreen.tsx

@@ -18,6 +18,12 @@ export function AgeRestrictedScreen({
     return (
       fallback || (
         <Layout.Screen>
+          <Layout.Header.Outer>
+            <Layout.Header.Content>
+              <Layout.Header.TitleText> </Layout.Header.TitleText>
+            </Layout.Header.Content>
+            <Layout.Header.Slot />
+          </Layout.Header.Outer>
           <Layout.Content />
         </Layout.Screen>
       )

src/components/ageAssurance/IsAgeRestricted.tsx

@@ -7,9 +7,15 @@ export function True({
   children: React.ReactNode
   fallback?: React.ReactNode
 }) {
-  const {isLoaded, isAgeRestricted} = useAgeAssuranceContext()
+  const {isLoaded, isAgeRestricted, isExempt} = useAgeAssuranceContext()
+  /**
+   * For the true case, if the user is exempt, return nothing
+   */
+  if (isExempt) return null
+
   const isDefinitelyAgeRestricted = isLoaded && isAgeRestricted
   const notSureYet = isAgeRestricted
+
   return isDefinitelyAgeRestricted
     ? children
     : notSureYet
@@ -24,9 +30,16 @@ export function False({
   children: React.ReactNode
   fallback?: React.ReactNode
 }) {
-  const {isLoaded, isAgeRestricted} = useAgeAssuranceContext()
+  const {isLoaded, isAgeRestricted, isExempt} = useAgeAssuranceContext()
+
+  /**
+   * For the false case, if the user is exempt, return children
+   */
+  if (isExempt) return children
+
   const isDefinitelyNotAgeRestricted = isLoaded && !isAgeRestricted
   const notSureYet = !isAgeRestricted
+
   return isDefinitelyNotAgeRestricted
     ? children
     : notSureYet