@treely/strapi-slices 4.4.0 → 4.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@treely/strapi-slices",
-  "version": "4.4.0",
+  "version": "4.4.2",
   "license": "MIT",
   "author": "Tree.ly GmbH",
   "description": "@treely/strapi-slices is a open source library maintained by Tree.ly.",

package/src/components/portfolio/SmallCheckout/SmallCheckout.tsx

@@ -252,9 +252,8 @@ const SmallCheckout = ({
         {button && (
           <StrapiLinkButton
             link={{
-              id: 1,
               intercomLauncher: true,
-              text: button.text,
+              ...button,
             }}
             variant="outline"
           />

package/src/models/strapi/StrapiBlogPost.ts

@@ -13,8 +13,8 @@ interface StrapiBlogPost {
   slug: string;
   teaser: string | null;
   img: StrapiImage;
-  author?: IStrapi<IStrapiData<StrapiAuthor>>;
-  category?: IStrapi<IStrapiData<StrapiCategory>>;
+  author: IStrapi<IStrapiData<StrapiAuthor> | null>;
+  category: IStrapi<IStrapiData<StrapiCategory> | null>;
   locale: Locale;
   createdAt: string;
   updatedAt: string;

package/src/models/strapi/StrapiHeroCard.ts

@@ -1,14 +1,11 @@
 import StrapiImage from './StrapiImage';
+import StrapiLink from './StrapiLink';
 
 interface StrapiHeroCard {
   id: number;
   title: string;
   subTitle: string;
-  button?: {
-    id: number;
-    url: string;
-    text: string;
-  };
+  button?: StrapiLink;
   image?: StrapiImage;
 }
 

package/src/models/strapi/StrapiLink.ts

@@ -5,7 +5,7 @@ import StrapiLinkPage from './StrapiLinkPage';
 interface StrapiLink {
   id: number;
   text: string;
-  page?: IStrapi<IStrapiData<StrapiLinkPage>>;
+  page?: IStrapi<IStrapiData<StrapiLinkPage> | null>;
   url?: string;
   intercomLauncher?: boolean;
 }

package/src/models/strapi/StrapiProject.ts

@@ -20,7 +20,7 @@ interface StrapiProject {
   thumbnail: StrapiImage | null;
   slices: any[];
   localizations: StrapiLocalization[];
-  portfolio: IStrapi<IStrapiData<StrapiPortfolio>>;
+  portfolio: IStrapi<IStrapiData<StrapiPortfolio> | null>;
   topBanner?: StrapiTopBanner;
 }
 

package/src/slices/Blog/Blog.tsx

@@ -59,7 +59,7 @@ export const Blog: React.FC<BlogProps> = ({ slice, blogPosts }: BlogProps) => {
                   />
                 </ImageContainer>
                 <Box px="2" py="8">
-                  {blogPost.attributes.category && (
+                  {blogPost.attributes.category.data && (
                     <Text size="smMonoUppercase" color="primary.800" mb="2">
                       {blogPost.attributes.category.data.attributes.name}
                     </Text>
@@ -74,7 +74,7 @@ export const Blog: React.FC<BlogProps> = ({ slice, blogPosts }: BlogProps) => {
                   <DatePersonPair
                     date={formatDate(blogPost.attributes.createdAt)}
                     person={
-                      blogPost.attributes.author
+                      blogPost.attributes.author.data
                         ? {
                             name: blogPost.attributes.author.data.attributes
                               .name,

package/src/slices/BlogCards/BlogCards.test.tsx

@@ -12,6 +12,7 @@ const defaultProps: BlogCardsProps = {
     title: 'Main Title',
     subTitle: 'Subtitle',
     variant: 'white',
+    blogPostCategory: { data: null },
   },
   blogPosts: [strapiBlogPostMock],
 };

package/src/slices/BlogCards/BlogCards.tsx

@@ -34,7 +34,7 @@ export interface BlogCardsProps {
     subTitle: string;
     button?: StrapiLink;
     variant: 'white' | 'gray';
-    blogPostCategory?: IStrapi<IStrapiData<StrapiCategory>>;
+    blogPostCategory: IStrapi<IStrapiData<StrapiCategory> | null>;
   };
   blogPosts: IStrapiData<StrapiBlogPost>[];
 }
@@ -74,7 +74,7 @@ export const BlogCards: React.FC<BlogCardsProps> = ({
         ? sortedBlogPosts
             .filter(
               (blogPost) =>
-                blogPost.attributes.category?.data.attributes.name ===
+                blogPost.attributes.category.data?.attributes.name ===
                 slice.blogPostCategory?.data?.attributes.name
             )
             .slice(0, 3)
@@ -142,7 +142,7 @@ export const BlogCards: React.FC<BlogCardsProps> = ({
               <Box px="2" py="8">
                 {blogPost.attributes.category && (
                   <Text size="smMonoUppercase" color="primary.800" mb="2">
-                    {blogPost.attributes.category.data.attributes.name}
+                    {blogPost.attributes.category.data?.attributes.name}
                   </Text>
                 )}
                 <Heading size="lg">{blogPost.attributes.title}</Heading>
@@ -157,7 +157,7 @@ export const BlogCards: React.FC<BlogCardsProps> = ({
                 <DatePersonPair
                   date={formatDate(blogPost.attributes.createdAt)}
                   person={
-                    blogPost.attributes.author
+                    blogPost.attributes.author.data
                       ? {
                           name: blogPost.attributes.author.data.attributes.name,
                           image: (

package/src/slices/Cta/Cta.tsx

@@ -56,6 +56,7 @@ const STATES: Record<CtaCardType, Record<string, any>> = {
     justifyContent: 'space-between',
     buttonJustifyContent: 'start',
     textMarginLeft: ['0', null, null, null, '14'],
+    textMarginRight: '0',
   },
   centerWithoutImage: {
     textAlign: 'center',
@@ -64,6 +65,7 @@ const STATES: Record<CtaCardType, Record<string, any>> = {
     justifyContent: 'center',
     buttonJustifyContent: 'center',
     textMarginLeft: '0',
+    textMarginRight: '0',
   },
   centerWithImage: {
     textAlign: 'center',
@@ -72,6 +74,7 @@ const STATES: Record<CtaCardType, Record<string, any>> = {
     justifyContent: 'center',
     buttonJustifyContent: 'center',
     textMarginLeft: '0',
+    textMarginRight: '0',
   },
   right: {
     textAlign: 'left',
@@ -80,6 +83,7 @@ const STATES: Record<CtaCardType, Record<string, any>> = {
     justifyContent: 'start',
     buttonJustifyContent: 'start',
     textMarginLeft: '0',
+    textMarginRight: ['0', null, null, null, '10'],
   },
 };
 
@@ -316,6 +320,7 @@ export const Cta: React.FC<CtaProps> = ({ slice }: CtaProps) => {
                   <Box
                     zIndex="base"
                     marginLeft={STATES[ctaCardType].textMarginLeft}
+                    marginRight={STATES[ctaCardType].textMarginRight}
                     maxWidth="3xl"
                   >
                     <Spacer height={['0', null, null, null, '20']} />

package/src/slices/MapHero/MapHero.tsx

@@ -30,7 +30,7 @@ export const MapHero: React.FC<MapHeroProps> = ({ slice }: MapHeroProps) => {
   const [belowBreakpoint] = useMediaQuery(BREAKPOINT_LG_QUERY);
 
   return (
-    <MapHeroContainer>
+    <MapHeroContainer maxWidth="full">
       {slice.shape && (
         <ShapeContainer>
           <Image