chore: minor fixes (#404)

Author: talhainvenxion

src/ui/layouts/NonEditableConfig/index.tsx

@@ -410,20 +410,33 @@ export const NonEditableConfig: React.FC<{ details: any }> = ({ details }) => {
   }
   // const values = [...flavor?.config_schema?.properties];
 
-  // let result = Object.keys(flavor?.config_schema?.properties).reduce(function (
-  //   r: any,
-  //   name: any,
-  // ) {
-  //   return (
-  //     (r[name] =
-  //       flavor?.config_schema?.properties[name].type === 'string' &&
-  //       flavor?.config_schema?.properties[name].default === undefined
-  //         ? ''
-  //         : flavor?.config_schema?.properties[name].default),
-  //     r
-  //   );
-  // },
-  // {});
+  let result = Object.keys(flavor?.config_schema?.properties).reduce(function (
+    r: any,
+    name: any,
+  ) {
+    return (
+      (r[name] =
+        flavor?.config_schema?.properties[name].type === 'string' &&
+        flavor?.config_schema?.properties[name].default === undefined
+          ? ''
+          : flavor?.config_schema?.properties[name].default),
+      r
+    );
+  },
+  {});
+
+  function replaceNullWithEmptyString(obj: any) {
+    for (let prop in obj) {
+      if (obj[prop] === null) {
+        obj[prop] = '';
+      } else if (typeof obj[prop] === 'object') {
+        replaceNullWithEmptyString(obj[prop]);
+      }
+    }
+    return obj;
+  }
+
+  replaceNullWithEmptyString(details?.configuration);
   // let normalizeConfiguration = Object.keys(details?.configuration).reduce(
   //   function (r: any, name: any) {
   //     if (details?.configuration[name] === null) {
@@ -469,7 +482,7 @@ export const NonEditableConfig: React.FC<{ details: any }> = ({ details }) => {
   // {});
 
   const mappedObject = {
-    // ...result,
+    ...result,
     ...details?.configuration,
   };
   console.log(

src/ui/layouts/common/CollapseTable/index.tsx

@@ -18,10 +18,12 @@ export const CollapseTable: React.FC<TableProps & CollapseTableProps> = ({
   paginated,
   renderAfterRow,
   trOnClick,
+  route,
 }) => {
   // console.log('activeSorting', activeSorting);
   return (
     <Table
+      route={route}
       isExpended={isExpended}
       activeSorting={activeSorting}
       headerCols={headerCols}

src/ui/layouts/common/Table/index.tsx

@@ -13,6 +13,7 @@ import {
   // Paragraph,
   // icons,
 } from '../../../components';
+import { Link } from 'react-router-dom';
 // import { getPaginationData } from '../../../../utils/pagination';
 // import { Pagination } from '../Pagination';
 // import { usePaginationAsQueryParam } from '../../../hooks/usePaginationAsQueryParam';
@@ -29,6 +30,7 @@ export interface HeaderCol {
 }
 
 export interface TableProps {
+  route?: any;
   isExpended?: boolean;
   headerCols: HeaderCol[];
   tableRows: any[];
@@ -54,6 +56,7 @@ const createHeaders = (headers: any[]) => {
 };
 
 export const Table: React.FC<TableProps> = ({
+  route,
   isExpended,
   headerCols,
   tableRows,
@@ -453,7 +456,10 @@ export const Table: React.FC<TableProps> = ({
             style={{ textAlign: 'center', maxWidth: '700px', margin: '0 auto' }}
             paddingVertical="xxl"
           >
-            <H3>{emptyState && emptyState.text}</H3>
+            <H3>
+              {emptyState && emptyState.text}{' '}
+              {route && <Link to={route}>Click here to register new one.</Link>}
+            </H3>
           </Box>
         )}
       />

src/ui/layouts/connectors/Connectors/List/index.tsx

@@ -170,6 +170,7 @@ Props) => {
   return (
     <>
       <CollapseTable
+        route={routePaths.connectors.connectorTypes(selectedWorkspace)}
         renderAfterRow={(connector: any) => (
           <>
             {/* <RunsForSecretTable
@@ -190,7 +191,15 @@ Props) => {
         filters={filter}
         headerCols={headerCols}
         tableRows={filteredConnectors}
-        emptyState={{ text: translate('emptyState.text') }}
+        emptyState={
+          filter[0]?.value
+            ? {
+                text: translate('emptyState.text'),
+              }
+            : {
+                text: `Nothing to see here, it seems like no service connecter has been configured yet.`,
+              }
+        }
         trOnClick={openDetailPage}
       />
       <If condition={connectorsPaginated.totalitem > 5}>

src/ui/layouts/pipelines/Pipelines/AllRuns/index.tsx

@@ -36,7 +36,11 @@ export const AllRuns: React.FC<Props> = ({
         getSorted={getSorted}
         paginated={runsPaginated}
         fetching={fetching}
-        emptyStateText={translate('emptyState.text')}
+        emptyStateText={
+          filter[0]?.value
+            ? translate('emptyState.text')
+            : `Nothing to see here, it seems like no run has been configured yet.`
+        }
         runIds={runIds}
         fromAllruns={true}
         filter={filter}

src/ui/layouts/pipelines/Pipelines/List/index.tsx

@@ -138,7 +138,15 @@ export const List: React.FC<Props> = ({
         filters={filter}
         headerCols={headerCols}
         tableRows={filteredPipelines}
-        emptyState={{ text: translate('emptyState.text') }}
+        emptyState={
+          filter[0]?.value
+            ? {
+                text: translate('emptyState.text'),
+              }
+            : {
+                text: `Nothing to see here, it seems like no pipeline has been configured yet.`,
+              }
+        }
         trOnClick={openDetailPage}
       />
 

src/ui/layouts/secrets/Secrets/List/index.tsx

@@ -167,6 +167,7 @@ Props) => {
   return (
     <>
       <CollapseTable
+        route={routePaths.secrets.registerSecrets(selectedWorkspace)}
         renderAfterRow={(secret: any) => (
           <>
             {/* <RunsForSecretTable
@@ -187,7 +188,15 @@ Props) => {
         filters={filter}
         headerCols={headerCols}
         tableRows={filteredSecrets}
-        emptyState={{ text: translate('emptyState.text') }}
+        emptyState={
+          filter[0]?.value
+            ? {
+                text: translate('emptyState.text'),
+              }
+            : {
+                text: `Nothing to see here, it seems like no secret has been configured yet.`,
+              }
+        }
         trOnClick={openDetailPage}
       />
       <If condition={secretsPaginated.totalitem > 5}>

src/ui/layouts/stackComponents/Stacks/List/index.tsx

@@ -134,6 +134,10 @@ Props) => {
   return (
     <>
       <CollapseTable
+        route={routePaths.stackComponents.registerComponents(
+          locationPath.split('/')[4],
+          selectedWorkspace,
+        )}
         renderAfterRow={(stack: TStack) => (
           <RunsForStackTable
             nestedRow={true}
@@ -255,6 +259,7 @@ Props) => {
               );
             }}
           >
+            {selectedWorkspace}
             Register New Component
           </PrimaryButton>
         </Box>

src/ui/layouts/stacks/Stacks/List/index.tsx

@@ -178,6 +178,7 @@ export const List: React.FC<Props> = ({
             />
           </>
         )}
+        route={routePaths.stacks.createStack(selectedWorkspace)}
         activeSorting={
           activeSortingDirection?.toLowerCase() + ':' + activeSorting
         }
@@ -188,7 +189,15 @@ export const List: React.FC<Props> = ({
         filters={filter}
         headerCols={headerCols}
         tableRows={filteredStacks}
-        emptyState={{ text: translate('emptyState.text') }}
+        emptyState={
+          filter[0]?.value
+            ? {
+                text: translate('emptyState.text'),
+              }
+            : {
+                text: `Nothing to see here, it seems like no stack has been configured yet.`,
+              }
+        }
         trOnClick={openDetailPage}
       />
       <If condition={stacksPaginated.totalitem > 5}>