@4alldigital/foundation-ui--core 3.0.0

package/src/templates/DashboardScreen/DashboardScreen.stories.tsx

@@ -0,0 +1,490 @@
+import type { Meta, StoryObj } from '@storybook/nextjs';
+import { formatPromos } from '@techstuff-dev/foundation-api-utils';
+import DashboardScreen from '.';
+import { BTN_SIZES, BTN_VARIANTS, CardVariant } from '../../components';
+
+const meta: Meta<typeof DashboardScreen> = {
+  title: 'TEMPLATES/DashboardScreen',
+  component: DashboardScreen,
+};
+
+type Story = StoryObj<typeof DashboardScreen>;
+
+const ESPromos = [
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/717:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2024-07/Screenshot%202024-07-01%20at%2016.14.25.png?itok=lAId30pt',
+      ],
+      align: ['left'],
+      auth_panel: [false],
+      button_text: ['Join Premium+'],
+      created: [1658310583],
+      description: [
+        '<p>This <em>NEW<strong> Sideline Sculpt</strong></em> Class will offer a comprehensive workout designed to sculpt, strengthen, and lengthen the entire sideline of the body, from the legs to the waist and core, as well as the arms. Utilizing ballet-inspired moves, this class focuses on small, controlled movements to target and tone muscles with precision. Through consistent practice, <em><span><strong>Sideline Sculpt</strong></span></em><span> is the ideal fitness class for tightening and toning the sides of your body, addressing those small areas of looseness for a more defined silhouette.</span></p><p><span>This class will launch on the </span><em><span>Premium+ subscription on July 8th.&nbsp;</span></em></p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2024-07/Screenshot%202024-07-01%20at%2016.14.25.png'],
+      langcode: ['en'],
+      link: ['/account/subscription'],
+      title: ['New Class : Sideline Sculpt'],
+      updated: [1719844354],
+      uuid: ['77cb4e18-ac48-4f2e-9b8d-b0d018b662aa'],
+      weight: [-2],
+    },
+    sort: [1719844354],
+  },
+];
+const formattedPromos = formatPromos(ESPromos);
+
+const ESPromoNews = [
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/668:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2024-07/Screenshot%202024-07-01%20at%2016.13.00.png?itok=hWGkbJ5s',
+      ],
+      align: ['right'],
+      auth_panel: [true],
+      button_text: ['Sign up to Premium+'],
+      created: [1649838096],
+      description: [
+        '<p>This <em>NEW<strong> Sideline Sculpt</strong></em> class offers a comprehensive workout designed to sculpt, strengthen, and lengthen the entire sideline of the body, from the legs to the waist and core, as well as the arms. Utilizing ballet-inspired moves, this class focuses on small, controlled movements to target and tone muscles with precision. Through consistent practice, <em><span><strong>Sideline Sculpt</strong></span></em><span> is the ideal fitness class for tightening and toning the sides of your body, addressing those small areas of looseness for a more defined silhouette.</span></p><p><span>This class is available in the LIVE CLASS section.</span></p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2024-07/Screenshot%202024-07-01%20at%2016.13.00.png'],
+      langcode: ['en'],
+      link: ['/account/subscription'],
+      section: [71],
+      title: ['New Class : Sideline Sculpt'],
+      updated: [1720528485],
+      uuid: ['17e6be84-eaef-4c9c-bd99-c3e5b0c5ab9e'],
+      weight: [-2],
+    },
+    sort: [1720528485],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/717:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2024-07/Screenshot%202024-07-01%20at%2016.14.25.png?itok=lAId30pt',
+      ],
+      align: ['left'],
+      auth_panel: [false],
+      button_text: ['Join Premium+'],
+      created: [1658310583],
+      description: [
+        '<p>This <em>NEW<strong> Sideline Sculpt</strong></em> Class will offer a comprehensive workout designed to sculpt, strengthen, and lengthen the entire sideline of the body, from the legs to the waist and core, as well as the arms. Utilizing ballet-inspired moves, this class focuses on small, controlled movements to target and tone muscles with precision. Through consistent practice, <em><span><strong>Sideline Sculpt</strong></span></em><span> is the ideal fitness class for tightening and toning the sides of your body, addressing those small areas of looseness for a more defined silhouette.</span></p><p><span>This class will launch on the </span><em><span>Premium+ subscription on July 8th.&nbsp;</span></em></p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2024-07/Screenshot%202024-07-01%20at%2016.14.25.png'],
+      langcode: ['en'],
+      link: ['/account/subscription'],
+      title: ['New Class : Sideline Sculpt'],
+      updated: [1719844354],
+      uuid: ['77cb4e18-ac48-4f2e-9b8d-b0d018b662aa'],
+      weight: [-2],
+    },
+    sort: [1719844354],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/1130:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2024-06/Screenshot%202024-06-10%20at%2014.47.43.png?itok=RSowQL-r',
+      ],
+      align: ['left'],
+      auth_panel: [true],
+      button_text: ['Wanna come with me?'],
+      created: [1713446631],
+      description: [
+        '<p>From the 28th of April until the 1st of May 2025, join me in St Paul de Vence in the heart of Provence, to enjoy some well deserved rest and pampering.&nbsp;<br>Join me for 3 nights at Le Mas de Pierre, a stunning eco-friendly 5* Relais &amp; Chateaux Hotel, a short 20min ride away from Nice.<br>During your stay, you will enjoy 3 NRG classes per day, delicious local food, access to the spa, a 30mn massage and a visit of St Paul de Vence.</p><p>Ask for the brochure nathalie@n-rg.co.uk</p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2024-06/Screenshot%202024-06-10%20at%2014.47.43.png'],
+      langcode: ['en'],
+      link: ['/register'],
+      title: ['NRG Retreat Saint Paul de Vence, France'],
+      updated: [1718557090],
+      uuid: ['56d8e326-84f9-40e6-b13a-e4299b02da26'],
+      weight: [-2],
+    },
+    sort: [1718557090],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/553:en',
+    _score: null,
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2023-08/Screenshot%202023-08-29%20at%2016.14.29.png?itok=qjfeucKp',
+      ],
+      align: ['right'],
+      auth_panel: [true],
+      button_text: ['Get Started'],
+      created: [1639231613],
+      description: [
+        '<p>When 10 minutes is all you have!</p><p>Check you these series of short workouts. Take your pick between someuick full body workouts or some more focused sessions.</p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2023-08/Screenshot%202023-08-29%20at%2016.14.29.png'],
+      langcode: ['en'],
+      section: [63],
+      title: ['10mn Daily Workouts'],
+      updated: [1718024571],
+      uuid: ['c8813027-a2e6-436f-9326-f0a41013e07f'],
+      weight: [0],
+    },
+    sort: [1718024571],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/1131:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      image_formatted: [
+        'https://assets.nrgbarrebody.app/styles/full_16_9/s3/2024-06/Screenshot%202024-06-10%20at%2014.47.43_0.png?itok=IspfEpDZ',
+      ],
+      align: ['right'],
+      auth_panel: [false],
+      button_text: ['Wanna come with me?'],
+      created: [1713447301],
+      description: [
+        '<p><span>From the 28th of April until the 1st of May 2025, join me in St Paul de Vence in the heart of Provence, to enjoy some well deserved rest and pampering.&nbsp;</span><br><span>Join me for 3 nights at Le Mas de Pierre, a stunning eco-friendly 5* Relais &amp; Chateaux Hotel, a short 20min ride away from Nice.</span><br><span>During your stay, you will enjoy 3 NRG classes per day, delicious local food, access to the spa, a 30mn massage and a visit of St Paul de Vence.</span></p><p>Ask for the brochure nathalie@n-rg.co.uk</p>',
+      ],
+      image: ['https://assets.nrgbarrebody.app/2024-06/Screenshot%202024-06-10%20at%2014.47.43_0.png'],
+      langcode: ['en'],
+      link: ['/register'],
+      title: ['NRG Retreat St Paul de Vence, France'],
+      updated: [1718024085],
+      uuid: ['8f6beb03-71de-4613-9691-63f0e7cb2ea6'],
+      weight: [-1],
+    },
+    sort: [1718024085],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/596:en',
+    _score: null,
+    _ignored: ['description.keyword'],
+    _source: {
+      _language: 'en',
+      align: ['center'],
+      auth_panel: [false],
+      background_video: ['https://assets.nrgbarrebody.app/2022-01/VideoPanel2%20-%20HD%201080p.mp4.mp4'],
+      button_text: ['Subscribe today'],
+      created: [1641649805],
+      description: [
+        '<p>Unlimited access to 460+ barre, Pilates, fitness fitness classes&nbsp;and targeted workouts.&nbsp;&nbsp;&nbsp;&nbsp;<br>Only \u00a34.50 per month. Cancel anytime.</p><p>Download the companion app.</p><div style="align-items:center;display:flex;justify-content:space-around;margin:auto;width:300px;"><a href="https://apps.apple.com/us/app/nrg-at-home/id1488214252?itsct=apps_box_badge&amp;itscg=30200" target="_blank"><img src="https://tools.applemediaservices.com/api/badges/download-on-the-app-store/black/en-us?size=150x50&amp;releaseDate=1592438400" alt="Download on the App Store" width="150" height="50" loading="lazy"></a> <a href="https://play.google.com/store/apps/details?id=app.nrgbarrebody&amp;gl=US&amp;pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1" target="_blank"><img src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png" alt="Get it on Google Play" width="194" height="75" loading="lazy"></a></div>',
+      ],
+      langcode: ['en'],
+      link: ['/register'],
+      title: ['NRG at home'],
+      updated: [1714459090],
+      uuid: ['f231daf6-511c-48a3-bad5-29ba4b7fd3c1'],
+      weight: [-5],
+    },
+    sort: [1714459090],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/598:en',
+    _score: null,
+    _source: {
+      _language: 'en',
+      align: ['left'],
+      auth_panel: [false],
+      button_text: ['Check It Out'],
+      created: [1641649806],
+      description: [
+        '<p>Unlimited access to over 400+ workouts varying from 10 mins to an hour in length. Suitable for all levels and ages. Workouts include NRG Signature barre, barre floor, booty blast, upper body, core, garuda, cardio barre and dance cardio classes.</p>',
+      ],
+      langcode: ['en'],
+      link: ['/catalogue'],
+      title: ['On-Demand Catalogue'],
+      updated: [1704111688],
+      uuid: ['706ca699-391f-434f-a0f3-9fb8e2cf853b'],
+      video: ['https://assets.nrgbarrebody.app/2022-01/catalogue-demo%20-%20SD%20480p.mp4.mp4'],
+      weight: [-1],
+    },
+    sort: [1704111688],
+  },
+  {
+    _index: 'elasticsearch_index_nrgprodcms_promo_panels',
+    _id: 'entity:node/626:en',
+    _score: null,
+    _source: {
+      _language: 'en',
+      background_image_formatted: [
+        'https://assets.nrgbarrebody.app/s3fs-public/styles/full_16_9/public/2022-01/catalogue-banner.png?itok=TtMA6K_B',
+      ],
+      align: ['center'],
+      auth_panel: [true],
+      background_image: ['https://assets.nrgbarrebody.app/s3fs-public/2022-01/catalogue-banner.png'],
+      button_text: ['Catalogue'],
+      created: [1642710220],
+      description: ['<p>Access the barre workouts catalogue.</p>'],
+      langcode: ['en'],
+      link: ['/catalogue'],
+      title: ['Catalogue'],
+      updated: [1646587478],
+      uuid: ['da238bfa-a7ed-408b-bf00-5eca69cdbadf'],
+      weight: [-3],
+    },
+    sort: [1646587478],
+  },
+];
+
+const formattedPromoNews = formatPromos(ESPromoNews);
+
+export const Default: Story = {
+  parameters: {
+    layout: 'fullscreen',
+  },
+  args: {
+    title: 'Dashboard',
+    image: 'https://picsum.photos/600/400',
+    user: {
+      id: '1',
+      name: 'Joe Bloggs',
+    },
+    headerProps: {
+      loginCallback: () => console.log('Login clicked'),
+      isAuthenticated: false,
+    },
+    latestData: [
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '1',
+          title: 'Barre Floor with ball',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '2',
+          title: 'Legs and abs with ball',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '3',
+          title: '3 x15min Arms / Legs / Glutes and Core',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+    ],
+    recentdata: [
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '1',
+          title: 'Barre Floor with ball',
+          description:
+            'Card description.... Card description....Card description....Card description....Card description....Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '2',
+          title: 'Legs and abs with ball',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '3',
+          title: '3 x15min Arms / Legs / Glutes and Core',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '4',
+          title: 'Barre Floor with ball',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '5',
+          title: 'Legs and abs with ball',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+      {
+        variant: CardVariant.MEDIA,
+        data: {
+          id: '6',
+          title: '3 x15min Arms / Legs / Glutes and Core',
+          description: 'Card description....',
+          image: {
+            src: 'https://picsum.photos/450/275',
+            alt: 'Placeholder image',
+          },
+        },
+      },
+    ],
+    stats: [
+      {
+        variant: CardVariant.DATA,
+        data: {
+          id: '1',
+          data: {
+            item: '+',
+            label: 'Workouts liked',
+            numberData: {
+              from: 0,
+              to: 56,
+              animationOptions: {
+                ease: 'easeInOut',
+              },
+            },
+            animateNumber: true,
+          },
+        },
+      },
+      {
+        variant: CardVariant.DATA,
+        data: {
+          id: '2',
+          data: {
+            item: '+',
+            label: 'Workouts completed',
+            numberData: {
+              from: 0,
+              to: 76,
+              animationOptions: {
+                ease: 'easeInOut',
+              },
+            },
+            animateNumber: true,
+          },
+        },
+      },
+      {
+        variant: CardVariant.DATA,
+        data: {
+          id: '2',
+          data: {
+            item: '',
+            label: 'Challenges Entered',
+            numberData: {
+              from: 0,
+              to: 3,
+              animationOptions: {
+                ease: 'easeInOut',
+              },
+            },
+            animateNumber: true,
+          },
+        },
+      },
+    ],
+    promo: {
+      title: formattedPromos[0].title,
+      description: formattedPromos[0].description,
+      image: formattedPromos[0].image,
+      buttonData: {
+        variant: BTN_VARIANTS.PRIMARY,
+        size: BTN_SIZES.MEDIUM,
+        children: 'New Classes',
+        onClick: () => console.log('Button clicked'),
+      },
+    },
+    news: formattedPromoNews.map(promo => ({
+      variant: CardVariant.MEDIA,
+      data: {
+        id: promo.uuid,
+        title: promo.title,
+        description: promo.description,
+        image: {
+          src: promo.image,
+          alt: 'Placeholder image',
+        },
+        htmlDetails: true,
+      },
+    })),
+    handleLatestDataPress: (id: string) => console.log('Latest data card clicked', id),
+    handleRecentDataPress: (id: string) => console.log('Recent data card clicked', id),
+    handleNewsDataPress: (id: string) => console.log('News card clicked', id),
+    subscriptionStatus: 'premium',
+  },
+};
+
+export const NoSubscription: Story = {
+  parameters: {
+    layout: 'fullscreen',
+  },
+  args: {
+    ...Default.args,
+    subscriptionStatus: 'none',
+  },
+};
+
+export const DefaultPlan: Story = {
+  parameters: {
+    layout: 'fullscreen',
+  },
+  args: {
+    ...Default.args,
+    subscriptionStatus: 'default',
+  },
+};
+
+export default meta;

package/src/templates/DashboardScreen/DashboardScreen.tsx

@@ -0,0 +1,156 @@
+import Screen from '../../components/Screen';
+import { Props } from './DashboardScreen.types';
+import { Banner, Card, Copy, DisplayHeading, Heading, HEADING_TAGS, Loader, PanelHero } from '../../components';
+import { useLanguage } from '../../hooks';
+import { SPACING } from '../../components/Hero/Hero.types';
+import Carousel from '../../components/Carousel';
+
+const DashboardScreen = ({
+  testID,
+  title,
+  image,
+  user,
+  latestData,
+  recentdata,
+  stats,
+  promo,
+  news,
+  statsIsLoading,
+  promosIsLoading,
+  dataIsLoading,
+  handleLatestDataPress,
+  handleRecentDataPress,
+  handleNewsDataPress,
+  subscriptionStatus,
+}: Props) => {
+  const T = useLanguage();
+  const dashboardCarouselOptions = {
+    loop: false,
+    showArrows: true,
+    // New responsive API using Tailwind breakpoints
+    slidesPerView: {
+      base: 1,  // Mobile
+      sm: 2,    // 640px+
+      md: 3,    // 768px+  
+      lg: 4,    // 1024px+
+    },
+  };
+  return (
+    <Screen data-testid={testID || 'DashboardScreen'} image={image}>
+      {title && <DisplayHeading text={title} />}
+      {subscriptionStatus === 'none' && (
+        <div className="mb-6">
+          <Banner
+            icon="mdi:star"
+            title="Unlock Premium Content"
+            text="Ready to feel the burn and boost your energy? Click here to start your 7-day NRG at home fitness trial today! (first-time sucsrcibers only)"
+            href="/subscription"
+          />
+        </div>
+      )}
+      {subscriptionStatus === 'default' && (
+        <div className="mb-6">
+          <Banner
+            icon="mdi:arrow-up-bold"
+            title="Upgrade to Premium+"
+            text="Take your workouts to the next level — upgrade to NRG Premium+ for unlimited live classes and full on-demand access. Click here to upgrade now!"
+            href="/subscription"
+          />
+        </div>
+      )}
+      <div>
+        <Copy>
+          {T?.UI?.WELCOME} {user?.name}
+        </Copy>
+      </div>
+      {statsIsLoading && (
+        <div className="flex flex-1 min-h-[125px] items-center justify-center">
+          <Loader />
+        </div>
+      )}
+      {!statsIsLoading && stats && (
+        <div className="mb-8">
+          <Heading tag={HEADING_TAGS.H4}>{T?.UI?.ACTIVITY}</Heading>
+          <div className="flex flex-row gap-4 flex-wrap">
+            {stats.map((stat, index) => {
+              return (
+                <div key={`${stat.data.id}-${index}`}>
+                  <Card variant={stat.variant} data={stat.data} />
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      )}
+      {dataIsLoading && (
+        <div className="flex flex-1 min-h-[125px] items-center justify-center">
+          <Loader />
+        </div>
+      )}
+      {!dataIsLoading && latestData && (
+        <div>
+          <Heading tag={HEADING_TAGS.H4}>{T?.UI?.LATEST_WORKOUTS}</Heading>
+          <div>
+            <Carousel
+              data={latestData}
+              onPressCallback={handleLatestDataPress}
+              carouselOptions={dashboardCarouselOptions}
+            />
+          </div>
+        </div>
+      )}
+      {promosIsLoading && (
+        <div className="flex flex-1 min-h-[125px] items-center justify-center">
+          <Loader />
+        </div>
+      )}
+      {!promosIsLoading && promo && (
+        <div>
+          <Heading tag={HEADING_TAGS.H4} flush>
+            {T?.UI?.OUR_FEATURE}
+          </Heading>
+          <PanelHero {...promo} withBg={true} spacing={SPACING.ATOM} />
+        </div>
+      )}
+      {dataIsLoading && (
+        <div className="flex flex-1 min-h-[125px] items-center justify-center">
+          <Loader />
+        </div>
+      )}
+      {!dataIsLoading && recentdata && (
+        <div>
+          <Heading tag={HEADING_TAGS.H4}>{T?.UI?.RECENTLY_ADDED}</Heading>
+          <div>
+            <Carousel
+              data={recentdata}
+              onPressCallback={handleRecentDataPress}
+              carouselOptions={dashboardCarouselOptions}
+            />
+          </div>
+        </div>
+      )}
+      {promosIsLoading && (
+        <div className="flex flex-1 min-h-[125px] items-center justify-center">
+          <Loader />
+        </div>
+      )}
+      {!promosIsLoading && news && (
+        <div>
+          <Heading tag={HEADING_TAGS.H4}>{T?.UI?.WHATS_NEW}</Heading>
+          <div>
+            <Carousel
+              data={news}
+              onPressCallback={handleNewsDataPress}
+              carouselOptions={dashboardCarouselOptions}
+            />
+          </div>
+        </div>
+      )}
+    </Screen>
+  );
+};
+
+DashboardScreen.displayName = 'DashboardScreen';
+
+export default DashboardScreen;
+export type { Props };

package/src/templates/DashboardScreen/DashboardScreen.types.ts

@@ -0,0 +1,28 @@
+import { Props as CardProps } from '../../components/Card/Card.types';
+import { Props as PanelHeroProps } from '../../components/PanelHero/PanelHero.types';
+import { Props as HeaderProps } from '../../components/Header/Header.types';
+import { Props as FooterProps } from '../../components/Footer/Footer.types';
+export interface Props {
+  testID?: string;
+  title: string;
+  image?: string;
+  user?: {
+    id?: string;
+    name?: string;
+  };
+  latestData?: CardProps[];
+  recentdata?: CardProps[];
+  stats?: CardProps[];
+  promo?: PanelHeroProps;
+  news?: CardProps[];
+  statsIsLoading?: boolean;
+  promosIsLoading?: boolean;
+  dataIsLoading?: boolean;
+  handleLatestDataPress: (id: string) => void;
+  handleRecentDataPress: (id: string) => void;
+  handleNewsDataPress: (id: string) => void;
+  subscriptionStatus?: 'none' | 'default' | 'premium';
+  // web only props
+  headerProps?: HeaderProps;
+  footerProps?: FooterProps;
+}

package/src/templates/DashboardScreen/index.ts

@@ -0,0 +1 @@
+export { default } from './DashboardScreen';