Merge pull request #353 from zenml-io/UAT

Author: Cahllagerfeld

.env

@@ -1,3 +1,3 @@
-# REACT_APP_BASE_API_URL= https://felix.develaws.zenml.io/api/v1
-REACT_APP_BASE_API_URL= https://appserver.zenml.io/api/v1
+REACT_APP_BASE_API_URL="https://appserver.zenml.io/api/v1"
+REACT_APP_HUB_API_URL="https://hubapi.zenml.io"
 REACT_APP_VERSION=$npm_package_version

src/ui/layouts/common/layouts/AuthenticatedLayout/DeploymentBanner/styles.module.scss

@@ -6,6 +6,7 @@
     background-color: #FEFACB;
     font-size: 16px;
     display: flex;
+    font-family: Rubik;
     padding: .5rem 0;
     justify-content: center;
     align-items: center;

src/ui/layouts/pipelines/Pipelines/List/Status/useService.ts

@@ -11,7 +11,7 @@ export const useService = ({
 }): ServiceInterface => {
   let runs: { status: any; run: any }[] = [];
 
-  pipeline.runs.map((item: any, index: string | number) =>
+  pipeline?.runs?.map((item: any, index: string | number) =>
     runs.push({
       status: pipeline.status[index],
       run: pipeline.runs[index],

src/ui/layouts/pipelines/RunDetail/Detail/index.tsx

@@ -11,10 +11,10 @@ export const Details: React.FC<{ runId: TId }> = memo(({ runId }) => {
 
   return (
     <div className={styles.mainContainer}>
-        <GeneralInformationCard run={run} />
-        <OrchestratorCard run={run} />
-        <CodeCard run={run} />
-        <EnvironmentCard run={run} />
+      <GeneralInformationCard run={run} />
+      <OrchestratorCard run={run} />
+      <CodeCard run={run} />
+      <EnvironmentCard run={run} />
     </div>
   );
 });

src/ui/layouts/repositories/RepositoryDetail/components/detail-header.tsx

@@ -12,33 +12,35 @@ function RepositoryDetailHeader({ repository }: RepositoryDetailHeaderProps) {
   return (
     <div className={styles.detailHeader}>
       <img
-        src={repository.logo_url || Fallback}
-        alt={`Logo for repository ${repository.name}`}
+        src={repository?.logo_url || Fallback}
+        alt={`Logo for repository ${repository?.name}`}
         className={styles.detailHeader__imageContainer}
       ></img>
       <div className={styles.detailHeader__header}>
         <h1 className={styles.detailHeader__header__heading}>
-          {repository.name}
+          {repository?.name}
         </h1>
         <p className={styles.detailHeader__header__timestamp}>
-          Published {moment(repository.created).fromNow()}
+          Published {moment(repository?.created).fromNow()}
         </p>
         <div className={styles.detailHeader__footer}>
           <p className={styles.detailHeader__header__timestamp}>
-            {repository.user.name}
+            {repository?.user?.name}
           </p>
           <a
             target="_blank"
             rel="noopener noreferrer"
             onClick={(e) => e.stopPropagation()}
             href={`https://www.${
-              repository.source.attribute === 'GitHubCodeRepository'
+              repository?.source?.attribute === 'GitHubCodeRepository'
                 ? 'github'
                 : 'gitlab'
-            }.com/${repository.config.owner}/${repository.config.repository}`}
+            }.com/${repository?.config?.owner}/${
+              repository?.config?.repository
+            }`}
             className={styles.detailHeader__footer__link}
           >
-            {repository.source.attribute === 'GitHubCodeRepository'
+            {repository?.source?.attribute === 'GitHubCodeRepository'
               ? 'Github'
               : 'Gitlab'}{' '}
             <ArrowSquareOut

src/ui/layouts/repositories/RepositoryDetail/index.tsx

@@ -125,7 +125,7 @@ function RepositoryDetailOverview() {
       headerWithButtons
       renderHeaderRight={() => <></>}
     >
-      <RepositoryDetailHeader repository={repository!} />
+      <RepositoryDetailHeader repository={repository} />
     </BasePage>
   );
 }

src/ui/layouts/stackComponents/StackDetail/Configuration/index.tsx

@@ -363,7 +363,7 @@ export const Configuration: React.FC<{ stackId: TId; loading?: boolean }> = ({
           </Paragraph>
 
           <Box style={{ position: 'relative' }}>
-            {Object.keys(elementSchema).length < 1 && (
+            {Object.keys(elementSchema || {}).length < 1 && (
               <>
                 <div
                   style={{
@@ -529,7 +529,7 @@ export const Configuration: React.FC<{ stackId: TId; loading?: boolean }> = ({
           </Box> */}
 
           <Box style={{ position: 'relative' }}>
-            {Object.entries(elementSchema).map(([key, value], index) => (
+            {Object.entries(elementSchema || {}).map(([key, value], index) => (
               <>
                 <div
                   style={{