Merge branch 'main' into feature/III-6360

cultuurnet · Oct 24, 2024 · 243d140 · 243d140
2 parents a1aab87 + 344fc5e
commit 243d140
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 5 deletions.
diff --git a/next.config.js b/next.config.js
@@ -49,6 +49,7 @@ const moduleExports = {
     hotjarEventName: process.env.NEXT_PUBLIC_HOTJAR_EVENT_NAME,
     hotjarMissingFieldName: process.env.NEXT_PUBLIC_HOTJAR_MISSING_FIELD_NAME,
     ownershipEnabled: process.env.NEXT_PUBLIC_OWNERSHIP_ENABLED,
+    imgixUrl: process.env.NEXT_PUBLIC_IMGIX_URL,
   },
   pageExtensions: ['page.tsx', 'page.js', 'api.ts'],
   eslint: {

diff --git a/src/pages/dashboard/DashboardRow.tsx b/src/pages/dashboard/DashboardRow.tsx
@@ -1,3 +1,4 @@
+import getConfig from 'next/config';
 import { ReactNode, useMemo, useState } from 'react';
 
 import { ScopeTypes } from '@/constants/OfferType';
@@ -61,12 +62,13 @@ export const DashboardRow = ({
   ...props
 }: DashboardRowProps) => {
   const getValue = getValueFromTheme('dashboardPage');
+  const { publicRuntimeConfig } = getConfig();
   const { udbMainPositiveGreen, udbMainLightGreen, udbMainGrey, grey3 } =
     colors;
   const [isImageHovered, setIsImageHovered] = useState(false);
   const weights = getScopeWeights(scope);
   const minimumScore = useMemo(() => getMinimumScore(weights), [weights]);
-  const croppedImageBaseUrl = 'https://images-acc-uitdatabank.imgix.net/';
+  const croppedImageBaseUrl = publicRuntimeConfig.imgixUrl;
   const imageIdAndFormat = imageUrl?.split('/').at(-1);
   const croppedImageUrl = imageUrl
     ? `${croppedImageBaseUrl}${imageIdAndFormat}?fit=crop&crop=auto&w=500&h=500`
@@ -148,7 +150,7 @@ export const DashboardRow = ({
         spacing={4}
         flex={1}
         css={`
-          padding: 1.5rem;
+          padding: 1.2rem;
         `}
         justifyContent="center"
       >
@@ -177,17 +179,23 @@ export const DashboardRow = ({
         >
           {scope !== ScopeTypes.ORGANIZERS && (
             <Stack
-              width="27%"
+              width="25%"
               spacing={3}
               alignItems="flex-start"
               css={`
-                word-break: break-all;
+                word-break: break-word;
                 white-space: normal;
               `}
             >
               <Inline spacing={3} alignItems="center">
                 <Icon name={Icons.TAG} />
-                <Text>{type}</Text>
+                <Text
+                  css={`
+                    line-height: 1.2rem;
+                  `}
+                >
+                  {type}
+                </Text>
               </Inline>
               <Inline spacing={3} alignItems="center">
                 <Icon name={Icons.CALENDAR_ALT} />