add market place

src/Routes/Base/Header/NewButtonSelect.js

@@ -4,6 +4,7 @@ import styled from 'styled-components';
 import { Button, Dropdown } from 'antd';
 import { ReactComponent as IconAddPipeline } from 'images/no-fill/add-pipeline.svg';
 import { ReactComponent as IconAddAlgorithm } from 'images/algorithm-icon.svg';
+import { ReactComponent as IconAddMarketplace } from 'images/marketplace.svg';
 import { ReactComponent as IconDataSource } from 'images/datasource.svg';
 import {
   LEFT_SIDEBAR_NAMES,
@@ -39,6 +40,10 @@ export const topActions = [
     name: RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM,
     component: IconAddAlgorithm,
   },
+  {
+    name: RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE,
+    component: IconAddMarketplace,
+  },
   {
     name: RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE,
     component: IconDataSource,
@@ -54,6 +59,8 @@ const NewButtonSelect = () => {
     let page = RIGHT_SIDEBAR_NAMES.ADD_PIPELINE;
     if (pageName === NEW_ITEM_PAGE.ALGORITHM) {
       page = RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM;
+    } else if (pageName === NEW_ITEM_PAGE.MARKETPLACE) {
+      page = RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE;
     } else if (pageName === NEW_ITEM_PAGE.DATASOURCE) {
       page = RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE;
     }
@@ -75,6 +82,7 @@ const NewButtonSelect = () => {
       ),
       icon: <IconAddPipeline style={iconSize} />,
     },
+
     {
       key: RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM,
       label: (

src/Routes/Base/SidebarLeft/index.js

@@ -10,6 +10,7 @@ import { useErrorLogs, useCounters } from 'hooks/graphql';
 import { dataCountMock } from 'config';
 import { LEFT_SIDEBAR_NAMES, USER_GUIDE } from 'const';
 import { ReactComponent as AlgorithmIcon } from 'images/algorithm-icon.svg';
+import { ReactComponent as MarketplaceIcon } from 'images/marketplace.svg';
 import { ReactComponent as DataSourceIcon } from 'images/datasource.svg';
 
 import { ReactComponent as JobsIcon } from 'images/jobs-icon.svg';
@@ -56,6 +57,7 @@ const instanceCounterAdapter = obj => ({
   [LEFT_SIDEBAR_NAMES.QUEUE]: obj.queue || 0,
   [LEFT_SIDEBAR_NAMES.PIPELINES]: obj.pipelines,
   [LEFT_SIDEBAR_NAMES.ALGORITHMS]: obj.algorithms,
+  [LEFT_SIDEBAR_NAMES.MARKETPLACE]: 3,
   [LEFT_SIDEBAR_NAMES.DATASOURCES]: obj.dataSources,
   [LEFT_SIDEBAR_NAMES.WORKERS]: obj.workers,
   [LEFT_SIDEBAR_NAMES.DRIVERS]: obj.drivers,
@@ -72,6 +74,7 @@ const SidebarLeft = () => {
     const itemsMenu = [
       [LEFT_SIDEBAR_NAMES.JOBS, JobsIcon, '/jobs'],
       [LEFT_SIDEBAR_NAMES.QUEUE, QueueIcon, '/queue'],
+      [LEFT_SIDEBAR_NAMES.MARKETPLACE, MarketplaceIcon, '/marketplace'],
       [LEFT_SIDEBAR_NAMES.ALGORITHMS, AlgorithmIcon, '/algorithms'],
       [LEFT_SIDEBAR_NAMES.PIPELINES, PipelineIcon, '/pipelines'],
     ];

src/Routes/SidebarRight/AddAlgorithm/schemaMarketplace.js

@@ -0,0 +1,200 @@
+export const memoryTypes = [
+  'Ki',
+  'M',
+  'Mi',
+  'Gi',
+  'm',
+  'K',
+  'G',
+  'T',
+  'Ti',
+  'P',
+  'Pi',
+  'E',
+  'Ei',
+];
+
+const addAlgorithmSchema = {
+  ENV_TYPES: {
+    nodejs: 'Node.js',
+    python: 'Python',
+    java: 'Java',
+  },
+  BUILD_TYPES: {
+    CODE: {
+      DIVIDERS: {
+        BUILD: `Build Configuration`,
+      },
+      DRAGGER: {
+        field: 'code.dragger',
+      },
+      ENTRY_POINT: {
+        field: 'code.entryPoint',
+        label: 'Entry Point',
+        placeholder: 'Insert Entry Point',
+        message: 'Entry Point is required',
+      },
+      ENVIRONMENT: {
+        field: 'code.env',
+        placeholder: 'Pick Environment',
+        label: 'Environment',
+        message: 'Environment is required',
+      },
+      label: 'Code',
+      field: 'code',
+      BASE_IMAGE: {
+        field: 'code.baseImage',
+        label: 'Base Image',
+        placeholder: '(Optional) Docker Image Name',
+      },
+    },
+    GIT: {
+      DIVIDERS: {
+        BUILD: `Build Configuration`,
+        GIT: `Git Configuration`,
+        ADVANCED: `Git Advance Configuration`,
+      },
+      BASE_IMAGE: {
+        field: 'gitRepository.baseImage',
+        label: 'Base Image',
+        placeholder: '(Optional) Docker Image Name',
+      },
+      BRANCH: {
+        field: 'gitRepository.branchName',
+        label: 'Branch',
+        placeholder: '(Optional) Branch',
+      },
+      COMMIT: {
+        field: 'gitRepository.commit',
+        ID: {
+          field: 'gitRepository.commit.id',
+          label: 'Commit ID',
+          placeholder: '(Optional) Commit ID',
+        },
+        label: 'Commit Details',
+        MESSAGE: {
+          field: 'gitRepository.commit.message',
+          label: 'Message',
+          placeholder: '(Optional) Enter Commit Message',
+        },
+        TIMESTAMP: {
+          field: 'gitRepository.commit.timestamp',
+          label: 'Time Stamp',
+          placeholder: '(Optional) Enter Commit Time Stamp',
+        },
+      },
+      field: 'gitRepository',
+      GIT_KIND: {
+        field: 'gitRepository.gitKind',
+        label: 'Git Host',
+        placeholder: '(Optional) Git Host',
+        types: ['github', 'gitlab'],
+      },
+      label: 'Git',
+      TAG: {
+        field: 'gitRepository.tag',
+        label: 'Tag',
+        placeholder: '(Optional) Tag',
+      },
+      TOKEN: {
+        field: 'gitRepository.token',
+        label: 'Token',
+        placeholder: '(Optional) Token',
+      },
+      URL: {
+        field: 'gitRepository.url',
+        label: 'URL',
+        addOns: {
+          before: ['https://', 'http://'],
+          after: '.git',
+        },
+        placeholder: 'Enter Git Repository URL',
+        message: 'GIT URL required',
+      },
+      ENTRY_POINT: {
+        field: 'gitRepository.entryPoint',
+        label: 'Entry Point',
+        placeholder: 'Insert Entry Point',
+        message: 'Entry Point is required',
+      },
+      ENVIRONMENT: {
+        field: 'gitRepository.env',
+        placeholder: 'Pick Environment',
+        label: 'Environment',
+        message: 'Environment is required',
+      },
+    },
+    IMAGE: {
+      ALGORITHM_IMAGE: {
+        field: 'image.algorithmImage',
+        label: 'Algorithm Image',
+        placeholder: 'Insert URL',
+        message: 'Image URL required',
+      },
+      label: 'Image',
+      field: 'image',
+    },
+  },
+  MAIN: {
+    field: 'main',
+    CPU: {
+      field: 'main.cpu',
+      label: 'CPU Usage',
+    },
+    DIVIDER: {
+      ADVANCED: 'Advanced',
+      RESOURCES: 'Resources',
+    },
+    GPU: {
+      field: 'main.gpu',
+      label: 'GPU Usage',
+    },
+    MEMORY: {
+      field: 'main.mem',
+      label: 'Memory Usage',
+      types: memoryTypes,
+    },
+    NAME: {
+      field: 'main.name',
+      label: 'Algorithm Name',
+      placeholder: 'Insert Algorithm Name',
+      message:
+        'Lower cased letters and numbers are only allowed in Algorithm Name.',
+    },
+    DESCRIPTION: {
+      field: 'main.description',
+      label: 'Description',
+      placeholder: 'Algorithm Description',
+    },
+    SIDECAR: {
+      field: 'main.sideCars',
+      label: 'Side Car',
+    },
+    OPTIONS: {
+      field: 'main.options',
+      label: 'Options',
+      placeholder: '(Optional) Enable Options',
+      types: ['binary', 'opengl'],
+    },
+    WORKERS: {
+      field: 'main.minHotWorkers',
+      label: 'Min Hot Workers',
+    },
+    RESERVE_MEMORY: {
+      field: 'main.reservedMemory',
+      label: 'Reserved Memory',
+      types: memoryTypes,
+      tooltip:
+        "Reserved memory for HKube's operations, such as in-memory cache. Higher values speed up data retrieval but leave less memory for the algorithms. Lower values slow down data retrieval but leave more memory for the algorithms.",
+    },
+    WORKER_ENV: {
+      field: 'main.workerEnv',
+      label: 'Worker Env',
+    },
+    ALGORITEM_ENV: {
+      field: 'main.algorithmEnv',
+      label: 'Algorithm Env',
+    },
+  },
+};
+export default addAlgorithmSchema;

src/Routes/SidebarRight/Content.react.js

@@ -26,7 +26,15 @@ const rightSidebarContent = {
       </>
     ),
   },
-
+  [RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE]: {
+    width: DRAWER_SIZE.ADD_MARKETPLACE,
+    title: RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE,
+    description: (
+      <>
+        Marketplace <Text strong>descriptor</Text> to be added to the store.
+      </>
+    ),
+  },
   [RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE]: {
     width: DRAWER_SIZE.ADD_DATASOURCE,
     title: RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE,

src/Routes/SidebarRight/Drawer.js

@@ -25,6 +25,7 @@ const operationSelector = {
   [RIGHT_SIDEBAR_NAMES.DRIVERS]: DriversTable,
   [RIGHT_SIDEBAR_NAMES.ADD_PIPELINE]: AddPipeline,
   [RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM]: AddAlgorithm,
+  [RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE]: AddAlgorithm,
   [RIGHT_SIDEBAR_NAMES.RUN_RAW_PIPELINE]: RunRawPipeline,
   [RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE]: AddDataSource,
   [RIGHT_SIDEBAR_NAMES.ERROR_LOGS]: ErrorLogsTable,
@@ -39,6 +40,7 @@ const titleSelector = {
   [RIGHT_SIDEBAR_NAMES.DRIVERS]: DRAWER_TITLES.DRIVERS,
   [RIGHT_SIDEBAR_NAMES.ADD_PIPELINE]: DRAWER_TITLES.ADD_PIPELINE,
   [RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM]: DRAWER_TITLES.ADD_ALGORITHM,
+  [RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE]: DRAWER_TITLES.ADD_MARKETPLACE,
   [RIGHT_SIDEBAR_NAMES.RUN_RAW_PIPELINE]: DRAWER_TITLES.RUN_RAW_PIPELINE,
   [RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE]: DRAWER_TITLES.ADD_DATASOURCE,
   [RIGHT_SIDEBAR_NAMES.ERROR_LOGS]: DRAWER_TITLES.ERROR_LOGS,

src/Routes/SidebarRight/schema.js

@@ -21,6 +21,10 @@ export const topActions = [
     name: RIGHT_SIDEBAR_NAMES.ADD_ALGORITHM,
     component: IconAddAlgorithm,
   },
+  {
+    name: RIGHT_SIDEBAR_NAMES.ADD_MARKETPLACE,
+    component: IconAddAlgorithm,
+  },
   {
     name: RIGHT_SIDEBAR_NAMES.ADD_DATASOURCE,
     component: IconDataSource,

src/Routes/Tables/Algorithms/index.js

@@ -60,26 +60,19 @@ const AlgorithmsTable = () => {
 
   const getList = useMemo(() => {
     const filterValue = instanceFilter.algorithms.qAlgorithmName;
+    let list = query.data?.algorithms?.list || [];
 
-    if (filterValue != null && query.data?.algorithms?.list) {
-      const filterAlgorithm = query.data?.algorithms?.list.filter(item =>
-        item.name.includes(filterValue)
-      );
-      return [...filterAlgorithm];
+    if (filterValue) {
+      list = list.filter(item => item.name.includes(filterValue));
     }
+    // no marketplace
+    list = list.filter(item => !item.name.toLowerCase().startsWith('mark'));
 
-    return (
-      (query.data &&
-        query.data.algorithms &&
-        query.data.algorithms.list &&
-        [...query.data.algorithms.list].sort((x, y) => {
-          if (x.unscheduledReason && !y.unscheduledReason) return -1;
-          if (!x.unscheduledReason && y.unscheduledReason) return 1;
-
-          return x.modified < y.modified ? 1 : -1;
-        })) ||
-      []
-    );
+    return [...list].sort((x, y) => {
+      if (x.unscheduledReason && !y.unscheduledReason) return -1;
+      if (!x.unscheduledReason && y.unscheduledReason) return 1;
+      return x.modified < y.modified ? 1 : -1;
+    });
   }, [instanceFilter.algorithms.qAlgorithmName, query.data]);
 
   // if have keycloak remove avatar from columns job