@treely/strapi-slices 5.15.1 → 5.16.0

package/README.md

@@ -37,11 +37,17 @@ For local testing, you can link the package to your project:
 ```bash
 npm run build
 npm pack
+```
+
+Go to the project which uses the strapi-slices package and install the package there:
 
+```bash
 cd ../path/to/your/project
 npm install ../path/to/strapi-slices-package.tgz
 ```
 
+Note: The Strapi CMS uses the data from the `fpm-api` for staging.
+
 Commit message guideline
 
 The project uses the Angular commit message guideline. Find the documentation

package/dist/components/CreditsAvailableBadge/CreditsAvailableBadge.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import CreditsAvailableState from '../../models/CreditsAvailableState';
+import { CreditAvailability } from '../../models/fpm/FPMProject';
 export interface CreditsAvailableBadgeProps {
-    status: CreditsAvailableState;
+    status: CreditAvailability;
     href?: string;
 }
 declare const CreditsAvailableBadge: ({ status, href, }: CreditsAvailableBadgeProps) => React.JSX.Element;

package/dist/models/PortfolioProject.d.ts

@@ -1,12 +1,10 @@
 import { StrapiImage } from '..';
-import CreditsAvailableState from './CreditsAvailableState';
 import FPMProject from './fpm/FPMProject';
 interface PortfolioProject extends FPMProject {
     /** Remember to prefix the slug with portfolioHost */
     slug?: string;
     portfolioHost?: string;
     thumbnail?: StrapiImage | null;
-    creditsAvailable?: CreditsAvailableState;
     footerSubTitle?: string;
 }
 export default PortfolioProject;

package/dist/models/fpm/FPMProject.d.ts

@@ -1,4 +1,10 @@
 import Issuer from './Issuer';
+export declare enum CreditAvailability {
+    CREDITS_AVAILABLE = "credits_available",
+    NO_CREDITS_AVAILABLE = "no_credits_available",
+    SOME_CREDITS_AVAILABLE = "some_credits_available",
+    SOON_CREDITS_AVAILABLE = "soon_credits_available"
+}
 interface FPMProject {
     id: string;
     title: string;
@@ -31,6 +37,7 @@ interface FPMProject {
     forecastedAmountYearly?: number;
     riskBuffer?: number;
     defaultIssuer?: Issuer;
+    creditAvailability: CreditAvailability;
     createdAt: Date;
     updatedAt: Date;
 }

package/dist/models/strapi/StrapiProject.d.ts

@@ -1,4 +1,3 @@
-import CreditsAvailableState from '../CreditsAvailableState';
 import Locale from '../Locale';
 import IStrapi from './IStrapi';
 import IStrapiData from './IStrapiData';
@@ -11,7 +10,6 @@ interface StrapiProject {
     slug: string;
     locale: Locale;
     fpmProjectId?: string;
-    creditsAvailable?: CreditsAvailableState;
     footerSubTitle?: string;
     createdAt: string;
     updatedAt: string;

package/dist/rootMessages.de.d.ts

@@ -59,10 +59,6 @@ declare const rootMessagesDe: {
     'features.projectInfo.properties.forecastedAmountYear.label': string;
     'features.projectInfo.properties.riskBuffer': string;
     'features.projectInfo.properties.year': string;
-    'components.portfolioProjectCard.text.yes': string;
-    'components.portfolioProjectCard.text.some': string;
-    'components.portfolioProjectCard.text.no': string;
-    'components.portfolioProjectCard.text.notYet': string;
     'features.portfolio.documentsDownloadList.projectDocuments': string;
     'features.portfolio.documentsDownloadList.downloadDocument': string;
     'components.creditsAvailableBadge.text.yes': string;

package/dist/rootMessages.en.d.ts

@@ -59,10 +59,6 @@ declare const rootMessagesEn: {
     'features.projectInfo.properties.forecastedAmountYear.toolTip': string;
     'features.projectInfo.properties.riskBuffer': string;
     'features.projectInfo.properties.year': string;
-    'components.portfolioProjectCard.text.yes': string;
-    'components.portfolioProjectCard.text.some': string;
-    'components.portfolioProjectCard.text.no': string;
-    'components.portfolioProjectCard.text.notYet': string;
     'features.portfolio.documentsDownloadList.projectDocuments': string;
     'features.portfolio.documentsDownloadList.downloadDocument': string;
     'components.creditsAvailableBadge.text.yes': string;

package/dist/slices/ProjectGridCard/ProjectGridCard.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import PortfolioProject from '../../models/PortfolioProject';
+export interface ProjectGridCardProps {
+    project: PortfolioProject;
+}
+export declare const ProjectGridCard: ({ project, }: ProjectGridCardProps) => JSX.Element;

package/dist/slices/ProjectGridCard/index.d.ts

@@ -0,0 +1,2 @@
+import { ProjectGridCard } from './ProjectGridCard';
+export default ProjectGridCard;

package/dist/slices/ProjectsGrid/ProjectsGrid.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import PortfolioProject from '../../models/PortfolioProject';
-import { IStrapi, IStrapiData, StrapiProject } from '../..';
+import IStrapi from '../../models/strapi/IStrapi';
+import IStrapiData from '../../models/strapi/IStrapiData';
+import StrapiProject from '../../models/strapi/StrapiProject';
 export interface ProjectsGridProps {
     slice: {
         projects: IStrapi<IStrapiData<StrapiProject>[]>;

package/dist/slices/ProjectsMap/MapMarker.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
-import CreditsAvailableState from '../../models/CreditsAvailableState';
+import { CreditAvailability } from '../../models/fpm/FPMProject';
 export interface MapMarkerProps {
     title: string;
     isPublic?: boolean;
     projectDeveloper?: string;
     slug?: string;
     portfolioHost?: string;
-    creditsAvailable?: CreditsAvailableState;
+    creditAvailability: CreditAvailability;
 }
-declare const MapMarker: ({ title, projectDeveloper, slug, creditsAvailable, portfolioHost, isPublic, }: MapMarkerProps) => React.JSX.Element;
+declare const MapMarker: ({ title, projectDeveloper, slug, creditAvailability, portfolioHost, isPublic, }: MapMarkerProps) => React.JSX.Element;
 export default MapMarker;

package/dist/strapi-slices.cjs.development.js

@@ -534,9 +534,6 @@ var getPortfolioProjects = /*#__PURE__*/function () {
             if (strapiProject != null && strapiProject.attributes.slug) {
               toReturn.slug = strapiProject.attributes.slug;
             }
-            if (strapiProject != null && strapiProject.attributes.creditsAvailable) {
-              toReturn.creditsAvailable = strapiProject == null ? void 0 : strapiProject.attributes.creditsAvailable;
-            }
             if (strapiProject != null && strapiProject.attributes.thumbnail) {
               toReturn.thumbnail = strapiProject == null ? void 0 : strapiProject.attributes.thumbnail;
             }
@@ -2356,51 +2353,51 @@ var CardContainer = /*#__PURE__*/styled__default.default(boemly.Box)(_templateOb
 var _templateObject$4;
 var GLOBAL_STYLE = /*#__PURE__*/react$1.css(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  :root {\n    --default-hero-height: calc(100vh - var(--boemly-space-24));\n  }\n\n  a {\n    text-decoration: none;\n  }\n"])));
 
-var messagesDe$f = {
+var messagesDe$e = {
   'sections.comparison.backgroundShapes': 'Hintergrundformen'
 };
 
-var messagesDe$e = {
+var messagesDe$d = {
   'components.creditsAvailableBadge.text.yes': 'Credits verfügbar',
   'components.creditsAvailableBadge.text.some': 'Einige verbleibende Credits',
   'components.creditsAvailableBadge.text.no': 'Keine verbleibenden Credits',
-  'components.creditsAvailableBadge.text.notYet': 'Gutschriften bald verfügbar'
+  'components.creditsAvailableBadge.text.notYet': 'Credits bald verfügbar'
 };
 
-var messagesDe$d = {
+var messagesDe$c = {
   'sections.cta.backgroundShapes': 'Dunkle Hintergrundformen',
   'sections.cta.backgroundShapesLight': 'Helle Hintergrundformen'
 };
 
-var messagesDe$c = {
+var messagesDe$b = {
   'sections.customerCard.more': 'Weiterlesen'
 };
 
-var messagesDe$b = {
+var messagesDe$a = {
   'sections.customerQuoteCard.more': 'Weiterlesen'
 };
 
-var messagesDe$a = {
+var messagesDe$9 = {
   'sections.glossary.copyButtonLabel': 'Kopiere den Link zu diesem Abschnitt in die Zwischenablage',
   'sections.glossary.copySuccessMessage': 'Link in die Zwischenablage kopiert',
   'sections.glossary.copyFailureMessage': 'Link konnte nicht in die Zwischenablage kopiert werden'
 };
 
-var messagesDe$9 = {
+var messagesDe$8 = {
   'features.portfolio.documentsDownloadList.projectDocuments': 'Projektdokumente',
   'features.portfolio.documentsDownloadList.downloadDocument': 'Dokument herunterladen'
 };
 
-var messagesDe$8 = {
+var messagesDe$7 = {
   'sections.projectFacts.projectInfo.value': 'Projekt Infos',
   'projects.projectFacts.properties.area': 'Fläche'
 };
 
-var messagesDe$7 = {
+var messagesDe$6 = {
   'sections.projectsMap.link.text': 'Mehr Infos'
 };
 
-var messagesDe$6 = {
+var messagesDe$5 = {
   'features.projectInfo.projectInfo.value': 'Projekt Infos',
   'features.projectInfo.properties.area': 'Projekt Fläche',
   'features.projectInfo.properties.location': 'Standort',
@@ -2417,13 +2414,6 @@ var messagesDe$6 = {
   'features.projectInfo.properties.year': '{years} {years, plural, one {Jahr} other {Jahre} }'
 };
 
-var messagesDe$5 = {
-  'components.portfolioProjectCard.text.yes': 'Credits verfügbar',
-  'components.portfolioProjectCard.text.some': 'Einige verbleibende Credits',
-  'components.portfolioProjectCard.text.no': 'Keine verbleibenden Credits',
-  'components.portfolioProjectCard.text.notYet': 'Gutschriften bald verfügbar'
-};
-
 var messagesDe$4 = {
   'portfolio.smallCheckout.price.taxNotIncluded': 'ohne Steuern',
   'portfolio.smallCheckout.price.taxIncluded': 'Preis inklusive Steuern: {number}',
@@ -2474,53 +2464,53 @@ var unitMessagesDe = {
   'unit.formatter.tonsCo2PerYear': '{number} tCO₂/Jahr'
 };
 
-var rootMessagesDe = /*#__PURE__*/_extends({}, messagesDe$e, messagesDe$9, messagesDe$5, messagesDe$6, messagesDe$4, messagesDe$f, messagesDe$d, messagesDe$c, messagesDe$b, messagesDe$a, messagesDe$8, messagesDe$7, messagesDe$3, messagesDe$2, messagesDe$1, unitMessagesDe);
+var rootMessagesDe = /*#__PURE__*/_extends({}, messagesDe$d, messagesDe$8, messagesDe$5, messagesDe$4, messagesDe$e, messagesDe$c, messagesDe$b, messagesDe$a, messagesDe$9, messagesDe$7, messagesDe$6, messagesDe$3, messagesDe$2, messagesDe$1, unitMessagesDe);
 
-var messagesEn$d = {
+var messagesEn$c = {
   'sections.comparison.backgroundShapes': 'Background shapes'
 };
 
-var messagesEn$c = {
+var messagesEn$b = {
   'components.creditsAvailableBadge.text.yes': 'Credits available',
   'components.creditsAvailableBadge.text.some': 'Some remaining credits',
   'components.creditsAvailableBadge.text.no': 'No remaining credits',
   'components.creditsAvailableBadge.text.notYet': 'Credits available soon'
 };
 
-var messagesEn$b = {
+var messagesEn$a = {
   'sections.cta.backgroundShapesDark': 'Dark background shapes',
   'sections.cta.backgroundShapesLight': 'Light background shapes'
 };
 
-var messagesEn$a = {
+var messagesEn$9 = {
   'sections.customerCard.more': 'Read more'
 };
 
-var messagesEn$9 = {
+var messagesEn$8 = {
   'sections.customerQuoteCard.more': 'Read more'
 };
 
-var messagesEn$8 = {
+var messagesEn$7 = {
   'sections.glossary.copyButtonLabel': 'Copy a link to this section to your clipboard',
   'sections.glossary.copySuccessMessage': 'Copied the link to your clipboard',
   'sections.glossary.copyFailureMessage': 'Could not copy link to clipboard'
 };
 
-var messagesEn$7 = {
+var messagesEn$6 = {
   'features.portfolio.documentsDownloadList.projectDocuments': 'Project documents',
   'features.portfolio.documentsDownloadList.downloadDocument': 'Download document'
 };
 
-var messagesEn$6 = {
+var messagesEn$5 = {
   'sections.projectFacts.projectInfo.value': 'Project Infos',
   'projects.projectFacts.properties.area': 'Area'
 };
 
-var messagesEn$5 = {
+var messagesEn$4 = {
   'sections.projectsMap.link.text': 'Show more info'
 };
 
-var messagesEn$4 = {
+var messagesEn$3 = {
   'features.projectInfo.projectInfo.value': 'Project Infos',
   'features.projectInfo.properties.area': 'Project Area',
   'features.projectInfo.properties.location': 'Location',
@@ -2537,13 +2527,6 @@ var messagesEn$4 = {
   'features.projectInfo.properties.year': '{years} {years, plural, one {year} other {years} }'
 };
 
-var messagesEn$3 = {
-  'components.portfolioProjectCard.text.yes': 'Credits available',
-  'components.portfolioProjectCard.text.some': 'Some remaining credits',
-  'components.portfolioProjectCard.text.no': 'No remaining credits',
-  'components.portfolioProjectCard.text.notYet': 'Credits available soon'
-};
-
 var messagesEn$2 = {
   'portfolio.smallCheckout.price.taxNotIncluded': 'not including tax',
   'portfolio.smallCheckout.price.taxIncluded': 'Price including tax: {number}',
@@ -2594,7 +2577,7 @@ var unitMessagesEn = {
   'unit.formatter.tonsCo2PerYear': '{number} tCO₂/year'
 };
 
-var rootMessagesEn = /*#__PURE__*/_extends({}, messagesEn$c, messagesEn$7, messagesEn$3, messagesEn$4, messagesEn$2, messagesEn$d, messagesEn$b, messagesEn$a, messagesEn$9, messagesEn$8, messagesEn$6, messagesEn$5, messagesEn$1, messagesDe, messagesEn, unitMessagesEn);
+var rootMessagesEn = /*#__PURE__*/_extends({}, messagesEn$b, messagesEn$6, messagesEn$3, messagesEn$2, messagesEn$c, messagesEn$a, messagesEn$9, messagesEn$8, messagesEn$7, messagesEn$5, messagesEn$4, messagesEn$1, messagesDe, messagesEn, unitMessagesEn);
 
 var messages = {
   en: rootMessagesEn,
@@ -2890,15 +2873,6 @@ var TextWithTextCards = function TextWithTextCards(_ref) {
   }))));
 };
 
-var CreditsAvailableState;
-(function (CreditsAvailableState) {
-  CreditsAvailableState["YES"] = "yes";
-  CreditsAvailableState["SOME"] = "some";
-  CreditsAvailableState["NO"] = "no";
-  CreditsAvailableState["NOT_YET"] = "notYet";
-})(CreditsAvailableState || (CreditsAvailableState = {}));
-var CreditsAvailableState$1 = CreditsAvailableState;
-
 var FORMAT_AS_HECTARE_CONFIG = {
   unit: 'hectare',
   unitDisplay: 'short',
@@ -2910,41 +2884,98 @@ var FORMAT_AS_PERCENT_CONFIG = {
   maximumFractionDigits: 2
 };
 
-var PortfolioProjectCard = function PortfolioProjectCard(_ref) {
-  var _creditsAvailableMess, _project$creditsAvail, _project$thumbnail, _project$thumbnail2, _project$thumbnail3;
-  var project = _ref.project;
+var CreditAvailability;
+(function (CreditAvailability) {
+  CreditAvailability["CREDITS_AVAILABLE"] = "credits_available";
+  CreditAvailability["NO_CREDITS_AVAILABLE"] = "no_credits_available";
+  CreditAvailability["SOME_CREDITS_AVAILABLE"] = "some_credits_available";
+  CreditAvailability["SOON_CREDITS_AVAILABLE"] = "soon_credits_available";
+})(CreditAvailability || (CreditAvailability = {}));
+
+var CreditsAvailableBadge = function CreditsAvailableBadge(_ref) {
+  var _variants;
+  var status = _ref.status,
+    href = _ref.href;
   var _useContext = React.useContext(IntlContext),
-    formatMessage = _useContext.formatMessage,
+    formatMessage = _useContext.formatMessage;
+  var variants = (_variants = {}, _variants[CreditAvailability.CREDITS_AVAILABLE] = {
+    message: formatMessage({
+      id: 'components.creditsAvailableBadge.text.yes'
+    }),
+    color: 'var(--boemly-colors-primary-800)'
+  }, _variants[CreditAvailability.NO_CREDITS_AVAILABLE] = {
+    message: formatMessage({
+      id: 'components.creditsAvailableBadge.text.no'
+    }),
+    color: 'var(--boemly-colors-red-600)'
+  }, _variants[CreditAvailability.SOME_CREDITS_AVAILABLE] = {
+    message: formatMessage({
+      id: 'components.creditsAvailableBadge.text.some'
+    }),
+    color: 'var(--boemly-colors-orange-500)'
+  }, _variants[CreditAvailability.SOON_CREDITS_AVAILABLE] = {
+    message: formatMessage({
+      id: 'components.creditsAvailableBadge.text.notYet'
+    }),
+    color: 'var(--boemly-colors-blue-500)'
+  }, _variants);
+  var variant = variants[status];
+  return React__default.default.createElement(boemly.Flex, {
+    justifyContent: "flex-start",
+    as: href ? Link__default.default : undefined,
+    href: href
+  }, React__default.default.createElement(boemly.Tag, {
+    backgroundColor: variant.color,
+    mt: "2",
+    mb: "1"
+  }, React__default.default.createElement(react.Info, {
+    size: 12,
+    color: "white",
+    weight: "fill"
+  }), React__default.default.createElement(boemly.Spacer, {
+    width: "1"
+  }), React__default.default.createElement(boemly.Text, {
+    color: "white",
+    size: "xsLowBold"
+  }, variant.message)));
+};
+
+var ProjectGridCard = function ProjectGridCard(_ref) {
+  var _project$thumbnail, _project$thumbnail2, _project$thumbnail3;
+  var project = _ref.project;
+  var _useContext = React.useContext(reactIntl.IntlContext),
     formatNumber = _useContext.formatNumber;
-  var creditsAvailableMessages = (_creditsAvailableMess = {}, _creditsAvailableMess[CreditsAvailableState$1.YES] = formatMessage({
-    id: 'components.portfolioProjectCard.text.yes'
-  }), _creditsAvailableMess[CreditsAvailableState$1.SOME] = formatMessage({
-    id: 'components.portfolioProjectCard.text.some'
-  }), _creditsAvailableMess[CreditsAvailableState$1.NO] = formatMessage({
-    id: 'components.portfolioProjectCard.text.no'
-  }), _creditsAvailableMess[CreditsAvailableState$1.NOT_YET] = formatMessage({
-    id: 'components.portfolioProjectCard.text.notYet'
-  }), _creditsAvailableMess);
-  return React__default.default.createElement(boemly.ProjectCard, {
-    title: project.title,
-    facts: [{
-      id: 1,
-      text: formatNumber((project.area || 0) / 10000, FORMAT_AS_HECTARE_CONFIG)
-    }, {
-      id: 2,
-      text: project.location || ''
-    }],
-    footerTitle: creditsAvailableMessages[(_project$creditsAvail = project.creditsAvailable) != null ? _project$creditsAvail : CreditsAvailableState$1.NOT_YET],
-    footerSubTitle: project.footerSubTitle || '',
-    image: project.thumbnail && React__default.default.createElement(Image__default.default, {
-      src: strapiMediaUrl((_project$thumbnail = project.thumbnail) == null ? void 0 : _project$thumbnail.img, 'medium'),
-      alt: (_project$thumbnail2 = project.thumbnail) == null ? void 0 : _project$thumbnail2.alt,
-      fill: true,
-      style: {
-        objectFit: ((_project$thumbnail3 = project.thumbnail) == null ? void 0 : _project$thumbnail3.objectFit) || 'cover'
-      }
-    })
-  });
+  return React__default.default.createElement(boemly.Container, null, React__default.default.createElement(boemly.Flex, {
+    flexDir: "column",
+    height: "full"
+  }, project.thumbnail && React__default.default.createElement(boemly.Box, {
+    borderRadius: "xl",
+    position: "relative",
+    height: "36",
+    mb: "2"
+  }, React__default.default.createElement(Image__default.default, {
+    src: strapiMediaUrl((_project$thumbnail = project.thumbnail) == null ? void 0 : _project$thumbnail.img, 'medium'),
+    alt: (_project$thumbnail2 = project.thumbnail) == null ? void 0 : _project$thumbnail2.alt,
+    fill: true,
+    style: {
+      objectFit: ((_project$thumbnail3 = project.thumbnail) == null ? void 0 : _project$thumbnail3.objectFit) || 'cover',
+      borderRadius: 'var(--boemly-radii-xl)'
+    }
+  })), React__default.default.createElement(boemly.Heading, {
+    my: "4",
+    size: "lg"
+  }, project.title), React__default.default.createElement(boemly.Flex, {
+    flexDir: "row",
+    gap: "2"
+  }, React__default.default.createElement(boemly.Tag, null, React__default.default.createElement(boemly.Text, {
+    size: "xsLowBold",
+    color: "gray.800"
+  }, formatNumber((project.area || 0) / 10000, FORMAT_AS_HECTARE_CONFIG))), React__default.default.createElement(boemly.Tag, null, React__default.default.createElement(boemly.Text, {
+    size: "xsLowBold",
+    color: "gray.800"
+  }, project.location))), React__default.default.createElement(CreditsAvailableBadge, {
+    status: project.creditAvailability
+  })));
 };
 
 var TextWithCard = function TextWithCard(_ref) {
@@ -2959,7 +2990,7 @@ var TextWithCard = function TextWithCard(_ref) {
     rowSpan: 1,
     position: "relative",
     "data-testid": "card-position-" + slice.cardPosition
-  }, portfolioProject && React__default.default.createElement(PortfolioProjectCard, {
+  }, portfolioProject && React__default.default.createElement(ProjectGridCard, {
     project: portfolioProject
   }), !portfolioProject && slice.card && React__default.default.createElement(boemly.ProjectCard, {
     facts: slice.card.facts,
@@ -3253,7 +3284,7 @@ var ProjectsGrid = function ProjectsGrid(_ref2) {
       _hover: {
         boxShadow: 'lg'
       }
-    }, React__default.default.createElement(PortfolioProjectCard, {
+    }, React__default.default.createElement(ProjectGridCard, {
       project: project
     })));
   }))));
@@ -3307,47 +3338,11 @@ var MinimalProviders = function MinimalProviders(_ref) {
   }, children));
 };
 
-var CreditsAvailableBadge = function CreditsAvailableBadge(_ref) {
-  var _variants;
-  var status = _ref.status,
-    href = _ref.href;
-  var _useContext = React.useContext(IntlContext),
-    formatMessage = _useContext.formatMessage;
-  var variants = (_variants = {}, _variants[CreditsAvailableState$1.YES] = {
-    color: 'green',
-    text: formatMessage({
-      id: 'components.creditsAvailableBadge.text.yes'
-    })
-  }, _variants[CreditsAvailableState$1.SOME] = {
-    color: 'orange',
-    text: formatMessage({
-      id: 'components.creditsAvailableBadge.text.some'
-    })
-  }, _variants[CreditsAvailableState$1.NO] = {
-    color: 'red',
-    text: formatMessage({
-      id: 'components.creditsAvailableBadge.text.no'
-    })
-  }, _variants[CreditsAvailableState$1.NOT_YET] = {
-    color: 'blue',
-    text: formatMessage({
-      id: 'components.creditsAvailableBadge.text.notYet'
-    })
-  }, _variants);
-  var variant = variants[status];
-  return React__default.default.createElement(boemly.Badge, {
-    as: href ? Link__default.default : undefined,
-    href: href,
-    colorScheme: variant.color,
-    width: "fit-content"
-  }, variant.text);
-};
-
 var MapMarker = function MapMarker(_ref) {
   var title = _ref.title,
     projectDeveloper = _ref.projectDeveloper,
     slug = _ref.slug,
-    creditsAvailable = _ref.creditsAvailable,
+    creditAvailability = _ref.creditAvailability,
     _ref$portfolioHost = _ref.portfolioHost,
     portfolioHost = _ref$portfolioHost === void 0 ? '' : _ref$portfolioHost,
     _ref$isPublic = _ref.isPublic,
@@ -3381,12 +3376,12 @@ var MapMarker = function MapMarker(_ref) {
     maxWidth: ['3xs', null, null, 'sm']
   }, React__default.default.createElement(boemly.Flex, {
     direction: "column"
-  }, creditsAvailable && React__default.default.createElement(React__default.default.Fragment, null, React__default.default.createElement(CreditsAvailableBadge, {
-    status: creditsAvailable,
+  }, React__default.default.createElement(CreditsAvailableBadge, {
+    status: creditAvailability,
     href: slug && portfolioHost + "/portfolio/" + slug
-  }), React__default.default.createElement(boemly.Box, {
+  }), React__default.default.createElement(boemly.Spacer, {
     height: "3"
-  })), React__default.default.createElement(boemly.Heading, {
+  }), React__default.default.createElement(boemly.Heading, {
     size: "md"
   }, title), projectDeveloper && React__default.default.createElement(boemly.Text, {
     size: "smLowNormal",
@@ -3450,7 +3445,7 @@ var ProjectsMap = function ProjectsMap(_ref) {
         isPublic: project.isPublic,
         portfolioHost: project.portfolioHost,
         slug: project.slug,
-        creditsAvailable: project.creditsAvailable,
+        creditAvailability: project.creditAvailability,
         projectDeveloper: (_project$projectDevel = project.projectDeveloper) == null ? void 0 : _project$projectDevel.name
       })));
       // Offset is needed to center the marker on the coordinates
@@ -4919,11 +4914,11 @@ var ProjectInfo = function ProjectInfo(_ref) {
     }),
     text: formatNumber(project.riskBuffer / 100, FORMAT_AS_PERCENT_CONFIG),
     caption: subtitles.riskBufferSubtitle
-  })))) : React__default.default.createElement(React__default.default.Fragment, null), project.creditsAvailable ? React__default.default.createElement(boemly.Box, {
+  })))) : React__default.default.createElement(React__default.default.Fragment, null), React__default.default.createElement(boemly.Box, {
     mt: "2"
   }, React__default.default.createElement(CreditsAvailableBadge, {
-    status: project.creditsAvailable
-  })) : React__default.default.createElement(React__default.default.Fragment, null));
+    status: project.creditAvailability
+  })));
 };
 
 var DocumentsDownloadList = function DocumentsDownloadList(_ref) {