@treely/strapi-slices 5.16.0 → 5.17.1

package/dist/utils/getMessages.d.ts

@@ -21,7 +21,6 @@ declare const getMessages: (locale: string) => {
     'sections.shopCheckout.submit': string;
     'sections.projectsMap.link.text': string;
     'sections.projectFacts.projectInfo.value': string;
-    'projects.projectFacts.properties.area': string;
     'sections.glossary.copyButtonLabel': string;
     'sections.glossary.copySuccessMessage': string;
     'sections.glossary.copyFailureMessage': string;
@@ -30,6 +29,8 @@ declare const getMessages: (locale: string) => {
     'sections.cta.backgroundShapesDark': string;
     'sections.cta.backgroundShapesLight': string;
     'sections.comparison.backgroundShapes': string;
+    'components.projectGridCard.certified': string;
+    'components.projectGridCard.certificationInProgres': string;
     'portfolio.smallCheckout.price.taxNotIncluded': string;
     'portfolio.smallCheckout.price.taxIncluded': string;
     'portfolio.smallCheckout.contributionValueCurrency.label.CHF': string;
@@ -88,7 +89,6 @@ declare const getMessages: (locale: string) => {
     'sections.shopCheckout.submit': string;
     'sections.projectsMap.link.text': string;
     'sections.projectFacts.projectInfo.value': string;
-    'projects.projectFacts.properties.area': string;
     'sections.glossary.copyButtonLabel': string;
     'sections.glossary.copySuccessMessage': string;
     'sections.glossary.copyFailureMessage': string;
@@ -97,6 +97,8 @@ declare const getMessages: (locale: string) => {
     'sections.cta.backgroundShapes': string;
     'sections.cta.backgroundShapesLight': string;
     'sections.comparison.backgroundShapes': string;
+    'components.projectGridCard.certified': string;
+    'components.projectGridCard.certificationInProgres': string;
     'portfolio.smallCheckout.price.taxNotIncluded': string;
     'portfolio.smallCheckout.price.taxIncluded': string;
     'portfolio.smallCheckout.contributionValueCurrency.label.CHF': string;

package/package.json

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

package/src/components/CreditsAvailableBadge/CreditsAvailableBadge.tsx

@@ -1,9 +1,8 @@
 import React, { useContext } from 'react';
-import { Flex, Spacer, Tag, Text } from 'boemly';
+import { Flex, Tag, Text } from 'boemly';
 import NextLink from 'next/link';
 import { IntlContext } from '../ContextProvider';
 import { CreditAvailability } from '../../models/fpm/FPMProject';
-import { Info } from '@phosphor-icons/react';
 
 export interface CreditsAvailableBadgeProps {
   status: CreditAvailability;
@@ -55,8 +54,6 @@ const CreditsAvailableBadge = ({
       href={href}
     >
       <Tag backgroundColor={variant.color} mt="2" mb="1">
-        <Info size={12} color="white" weight="fill" />
-        <Spacer width="1" />
         <Text color="white" size="xsLowBold">
           {variant.message}
         </Text>

package/src/{slices → components}/ProjectGridCard/ProjectGridCard.test.tsx

@@ -44,6 +44,12 @@ describe('The ProjectGridCard component', () => {
     expect(screen.getByText('Austria')).toBeInTheDocument();
   });
 
+  it('displays the certification date if it is defined', () => {
+    setup();
+
+    expect(screen.getByText('Certified, 2020')).toBeInTheDocument();
+  });
+
   it('displays the credits available badge', () => {
     setup();
 

package/src/{slices → components}/ProjectGridCard/ProjectGridCard.tsx

@@ -3,9 +3,9 @@ import React, { useContext } from 'react';
 import Image from 'next/image';
 import PortfolioProject from '../../models/PortfolioProject';
 import { strapiMediaUrl } from '../..';
-import { IntlContext } from 'react-intl';
 import { FORMAT_AS_HECTARE_CONFIG } from '../../constants/formatter';
 import CreditsAvailableBadge from '../../components/CreditsAvailableBadge';
+import { IntlContext } from '../ContextProvider';
 
 export interface ProjectGridCardProps {
   project: PortfolioProject;
@@ -14,7 +14,7 @@ export interface ProjectGridCardProps {
 export const ProjectGridCard = ({
   project,
 }: ProjectGridCardProps): JSX.Element => {
-  const { formatNumber } = useContext(IntlContext);
+  const { formatNumber, formatMessage } = useContext(IntlContext);
 
   return (
     <Container>
@@ -49,6 +49,24 @@ export const ProjectGridCard = ({
               {project.location}
             </Text>
           </Tag>
+          {project.certificationDate ? (
+            <Tag>
+              <Text size="xsLowBold" color="gray.800">
+                {formatMessage(
+                  { id: 'components.projectGridCard.certified' },
+                  { year: new Date(project.certificationDate).getFullYear() }
+                )}
+              </Text>
+            </Tag>
+          ) : (
+            <Tag>
+              <Text size="xsLowBold" color="gray.800">
+                {formatMessage({
+                  id: 'components.projectGridCard.certificationInProgress',
+                })}
+              </Text>
+            </Tag>
+          )}
         </Flex>
         <CreditsAvailableBadge status={project.creditAvailability} />
       </Flex>

package/src/components/ProjectGridCard/messages.de.ts

@@ -0,0 +1,6 @@
+const messagesDe = {
+  'components.projectGridCard.certified': 'Zertifiziert, {year}',
+  'components.projectGridCard.certificationInProgres':
+    'Zertifizierung ist in Arbeit',
+};
+export default messagesDe;

package/src/components/ProjectGridCard/messages.en.ts

@@ -0,0 +1,6 @@
+const messagesDe = {
+  'components.projectGridCard.certified': 'Certified, {year}',
+  'components.projectGridCard.certificationInProgres':
+    'Certification in progress',
+};
+export default messagesDe;

package/src/integrations/strapi/getPortfolioProjects.ts

@@ -67,9 +67,6 @@ const getPortfolioProjects = async (
     if (strapiProject?.attributes.thumbnail) {
       toReturn.thumbnail = strapiProject?.attributes.thumbnail;
     }
-    if (strapiProject?.attributes.footerSubTitle) {
-      toReturn.footerSubTitle = strapiProject?.attributes.footerSubTitle;
-    }
     if (strapiProject?.attributes.portfolio.data?.attributes.host) {
       toReturn.portfolioHost =
         strapiProject.attributes.portfolio.data.attributes.host;

package/src/models/PortfolioProject.ts

@@ -6,7 +6,6 @@ interface PortfolioProject extends FPMProject {
   slug?: string;
   portfolioHost?: string;
   thumbnail?: StrapiImage | null;
-  footerSubTitle?: string;
 }
 
 export default PortfolioProject;

package/src/models/fpm/FPMProject.ts

@@ -41,6 +41,7 @@ interface FPMProject {
   riskBuffer?: number;
   defaultIssuer?: Issuer;
   creditAvailability: CreditAvailability;
+  certificationDate?: Date;
 
   createdAt: Date;
   updatedAt: Date;

package/src/rootMessages.de.ts

@@ -6,6 +6,7 @@ import customerQuoteCardMessagesDe from './components/CustomerQuoteCard/messages
 import glossaryMessagesDe from './slices/Glossary/messages.de';
 import portfolioDocumentsDownloadListMessagesDe from './components/portfolio/DocumentsDownloadList/messages.de';
 import projectFactsMessagesDe from './slices/ProjectFacts/messages.de';
+import projectGridCardMessagesDe from './components/ProjectGridCard/messages.de';
 import projectsMapMessagesDe from './slices/ProjectsMap/messages.de';
 import portfolioProjectInfoMessagesDe from './components/portfolio/ProjectInfo/messages.de';
 import portfolioSmallCheckoutMessagesDe from './components/portfolio/SmallCheckout/messages.de';
@@ -23,6 +24,7 @@ const rootMessagesDe = {
   ...portfolioDocumentsDownloadListMessagesDe,
   ...portfolioProjectInfoMessagesDe,
   ...portfolioSmallCheckoutMessagesDe,
+  ...projectGridCardMessagesDe,
 
   //
   // Slices

package/src/rootMessages.en.ts

@@ -6,6 +6,7 @@ import customerQuoteCardMessagesEn from './components/CustomerQuoteCard/messages
 import glossaryMessagesEn from './slices/Glossary/messages.en';
 import portfolioDocumentsDownloadListMessagesEn from './components/portfolio/DocumentsDownloadList/messages.en';
 import projectFactsMessagesEn from './slices/ProjectFacts/messages.en';
+import projectGridCardMessagesEn from './components/ProjectGridCard/messages.en';
 import projectsMapMessagesEn from './slices/ProjectsMap/messages.en';
 import portfolioProjectInfoMessagesEn from './components/portfolio/ProjectInfo/messages.en';
 import portfolioSmallCheckoutMessagesEn from './components/portfolio/SmallCheckout/messages.en';
@@ -23,6 +24,7 @@ const rootMessagesEn = {
   ...portfolioDocumentsDownloadListMessagesEn,
   ...portfolioProjectInfoMessagesEn,
   ...portfolioSmallCheckoutMessagesEn,
+  ...projectGridCardMessagesEn,
 
   //
   // Slices

package/src/slices/ProjectFacts/messages.de.ts

@@ -1,5 +1,4 @@
 const messagesDe = {
   'sections.projectFacts.projectInfo.value': 'Projekt Infos',
-  'projects.projectFacts.properties.area': 'Fläche',
 };
 export default messagesDe;

package/src/slices/ProjectFacts/messages.en.ts

@@ -1,5 +1,4 @@
 const messagesEn = {
   'sections.projectFacts.projectInfo.value': 'Project Infos',
-  'projects.projectFacts.properties.area': 'Area',
 };
 export default messagesEn;

package/src/slices/ProjectsGrid/ProjectsGrid.stories.tsx

@@ -4,6 +4,7 @@ import { StoryFn, Meta } from '@storybook/react';
 import ProjectsGrid from '.';
 import { strapiProjectMock } from '../../test/strapiMocks/strapiProject';
 import portfolioProjectMock from '../../test/integrationMocks/portfolioProjectMock';
+import { CreditAvailability } from '../../models/fpm/FPMProject';
 
 export default {
   title: 'slices/ProjectsGrid',
@@ -21,3 +22,36 @@ Minimal.args = {
     projects: { data: [strapiProjectMock] },
   },
 };
+
+export const WithoutCertificationDate = Template.bind({});
+WithoutCertificationDate.args = {
+  projects: [{ ...portfolioProjectMock, certificationDate: undefined }],
+  slice: {
+    projects: { data: [strapiProjectMock] },
+  },
+};
+
+export const WithCreditsAvailabilityVariants = Template.bind({});
+WithCreditsAvailabilityVariants.args = {
+  projects: [
+    portfolioProjectMock,
+    {
+      ...portfolioProjectMock,
+      title: 'Project 2',
+      creditAvailability: CreditAvailability.SOME_CREDITS_AVAILABLE,
+    },
+    {
+      ...portfolioProjectMock,
+      title: 'Project 3',
+      creditAvailability: CreditAvailability.SOON_CREDITS_AVAILABLE,
+    },
+    {
+      ...portfolioProjectMock,
+      title: 'Project 4',
+      creditAvailability: CreditAvailability.NO_CREDITS_AVAILABLE,
+    },
+  ],
+  slice: {
+    projects: { data: [strapiProjectMock] },
+  },
+};

package/src/slices/ProjectsGrid/ProjectsGrid.test.tsx

@@ -16,7 +16,6 @@ const defaultProps: ProjectsGridProps = {
       slug: 'slug',
       isPublic: true,
       thumbnail: { img: { data: strapiMediaMock }, alt: 'Alt Text', id: 1 },
-      footerSubTitle: 'certified-123',
     },
   ],
 };

package/src/slices/ProjectsGrid/ProjectsGrid.tsx

@@ -2,11 +2,11 @@ import React from 'react';
 import { Box, DefaultSectionContainer, SimpleGrid, Wrapper } from 'boemly';
 import Link from 'next/link';
 import { MEDIUM_TRANSITION_DURATION } from '../../constants/animations';
-import ProjectGridCard from '../ProjectGridCard';
 import PortfolioProject from '../../models/PortfolioProject';
 import IStrapi from '../../models/strapi/IStrapi';
 import IStrapiData from '../../models/strapi/IStrapiData';
 import StrapiProject from '../../models/strapi/StrapiProject';
+import ProjectGridCard from '../../components/ProjectGridCard';
 
 export interface ProjectsGridProps {
   slice: {

package/src/slices/TextWithCard/TextWithCard.tsx

@@ -16,7 +16,7 @@ import StrapiLink from '../../models/strapi/StrapiLink';
 import StrapiProjectCard from '../../models/strapi/StrapiProjectCard';
 import StrapiLinkButton from '../../components/StrapiLinkButton';
 import { IStrapiData, PortfolioProject, StrapiProject } from '../..';
-import ProjectGridCard from '../ProjectGridCard';
+import ProjectGridCard from '../../components/ProjectGridCard';
 
 interface TextWithCardSlice {
   tagline?: string;

package/src/test/integrationMocks/fpmProjectMock.ts

@@ -33,6 +33,7 @@ const fpmProjectMock: FPMProject = {
   createdAt: new Date('2020-01-01'),
   updatedAt: new Date('2020-01-01'),
   creditAvailability: CreditAvailability.CREDITS_AVAILABLE,
+  certificationDate: new Date('2020-02-02'),
 };
 
 export default fpmProjectMock;

package/dist/test/integrationMocks/fpmPortoflioProjectMock.d.ts

@@ -1,3 +0,0 @@
-import { PortfolioProject } from '../..';
-declare const fpmPortfolioProjectMock: PortfolioProject;
-export default fpmPortfolioProjectMock;

package/src/test/integrationMocks/fpmPortoflioProjectMock.ts

@@ -1,16 +0,0 @@
-import { PortfolioProject } from '../..';
-import fpmProjectMock from './fpmProjectMock';
-import { storybookStrapiCoverMock } from '../storybookMocks/storybookStrapiMedia';
-
-const fpmPortfolioProjectMock: PortfolioProject = {
-  ...fpmProjectMock,
-  isPublic: true,
-  footerSubTitle: 'Certified, 2023',
-  thumbnail: {
-    id: 1,
-    img: { data: storybookStrapiCoverMock },
-    alt: 'Project Thumbnail',
-  },
-};
-
-export default fpmPortfolioProjectMock;