merged development

Author: mariana-furyk

package.json

@@ -24,7 +24,7 @@
     "final-form-arrays": "^3.1.0",
     "fs-extra": "^10.0.0",
     "identity-obj-proxy": "^3.0.0",
-    "iguazio.dashboard-react-controls": "2.2.20",
+    "iguazio.dashboard-react-controls": "2.2.22",
     "is-wsl": "^1.1.0",
     "js-base64": "^2.5.2",
     "js-yaml": "^4.1.0",
@@ -128,7 +128,7 @@
     "body-parser": "^1.19.0",
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "chai": "^4.3.4",
-    "chromedriver": "^132.0.0",
+    "chromedriver": "^134.0.0",
     "css-loader": "^6.5.1",
     "cucumber-html-reporter": "^5.3.0",
     "eslint": "^8.57.0",

src/api/artifacts-api.js

@@ -28,6 +28,7 @@ import {
   TAG_FILTER_ALL_ITEMS,
   TAG_FILTER_LATEST
 } from '../constants'
+import localStorageService from '../utils/localStorageService'
 
 const fetchArtifacts = (project, filters, config = {}, withLatestTag, withExactName) => {
   const params = {}
@@ -38,7 +39,7 @@ const fetchArtifacts = (project, filters, config = {}, withLatestTag, withExactN
 
   if (filters?.iter === SHOW_ITERATIONS) {
     params['best-iteration'] = true
-  } else if (!isNil(filters.iter) && !isEmpty(filters.iter)) {
+  } else if (!isNil(filters?.iter) && !isEmpty(filters?.iter)) {
     params.iter = filters.iter
   }
 
@@ -62,7 +63,22 @@ const fetchArtifacts = (project, filters, config = {}, withLatestTag, withExactN
 
 const artifactsApi = {
   addTag: (project, tag, data) => mainHttpClient.put(`/projects/${project}/tags/${tag}`, data),
-  buildFunction: data => mainHttpClient.post('/build/function', data),
+  buildFunction: data => {
+    const headers = {}
+    const mlrunVersion = localStorageService.getStorageValue('mlrunVersion')
+
+    if (mlrunVersion) {
+      headers['x-mlrun-client-version'] = mlrunVersion
+    }
+    
+    return mainHttpClient.post(
+      `/projects/${data.function.metadata.project}/nuclio/${data.function.metadata.name}/deploy`,
+      data,
+      {
+        headers
+      }
+    )
+  },
   deleteArtifact: (project, key, uid, deletion_strategy, secrets = {}) => {
     const config = {
       params: {

src/api/functions-api.js

@@ -19,6 +19,7 @@ such restriction.
 */
 import { functionTemplatesHttpClient, mainHttpClient, mainHttpClientV2 } from '../httpClient'
 import { DATES_FILTER, NAME_FILTER, SHOW_UNTAGGED_FILTER } from '../constants'
+import localStorageService from '../utils/localStorageService'
 
 const functionsApi = {
   createNewFunction: (project, data) =>
@@ -30,7 +31,22 @@ const functionsApi = {
     }),
   deleteSelectedFunction: (funcName, project) =>
     mainHttpClientV2.delete(`/projects/${project}/functions/${funcName}`),
-  deployFunction: data => mainHttpClient.post('/build/function', data),
+  deployFunction: data => {
+    const headers = {}
+    const mlrunVersion = localStorageService.getStorageValue('mlrunVersion')
+
+    if (mlrunVersion) {
+      headers['x-mlrun-client-version'] = mlrunVersion
+    }
+    
+    return mainHttpClient.post(
+      `/projects/${data.function.metadata.project}/nuclio/${data.function.metadata.name}/deploy`,
+      data,
+      {
+        headers
+      }
+    )
+  },
   getFunctions: (project, filters, config = {}, hash) => {
     const newConfig = {
       ...config,

src/common/FormTagFilter/formTagFilters.scss

@@ -7,7 +7,7 @@
   position: relative;
   display: flex;
   flex-direction: column;
-  width: auto;
+  width: 100%;
   min-width: 200px;
   height: 60px;
   color: $mulledWine;
@@ -20,7 +20,8 @@
   }
 
   &__input {
-    width: 196px;
+    width: 100%;
+    min-width: 196px;
     height: 100%;
     padding: 10px;
     color: $mulledWine;
@@ -36,9 +37,9 @@
   }
 
   &__dropdown {
+    align-items: normal;
     width: 100%;
     max-height: 400px;
-    align-items: normal;
     overflow-y: auto;
     background-color: $white;
     border: $primaryBorder;

src/common/ProjectDetailsHeader/ProjectDetailsHeader.js

@@ -24,9 +24,11 @@ import { getDateAndTimeByFormat } from '../../utils/'
 import { PROJECT_MONITOR, PROJECT_QUICK_ACTIONS_PAGE } from '../../constants'
 
 import './ProjectDetailsHeader.scss'
+import { useSelector } from 'react-redux'
 
 const ProjectDetailsHeader = ({ projectData, projectName }) => {
   const location = useLocation()
+  const frontendSpec = useSelector(store => store.appStore.frontendSpec)
 
   return (
     <div className="project-details">
@@ -48,10 +50,12 @@ const ProjectDetailsHeader = ({ projectData, projectName }) => {
                 {getDateAndTimeByFormat(projectData.metadata.created, 'MM/DD/YYYY, HH:mm:ss A')}
               </span>
             </li>
-            <li>
-              <span className="project-details__details-label">Owner:</span>
-              <span>{projectData.spec.owner}</span>
-            </li>
+            {!frontendSpec.ce?.version && (
+              <li>
+                <span className="project-details__details-label">Owner:</span>
+                <span>{projectData.spec.owner}</span>
+              </li>
+            )}
             <li>
               <span className="project-details__details-label">Status:</span>
               <div>

src/common/TabsSlider/TabsSlider.js

@@ -24,19 +24,17 @@ import classnames from 'classnames'
 
 import { Tip } from 'igz-controls/components'
 
-import { SLIDER_STYLE_1, SLIDER_STYLE_2, SLIDER_TABS } from '../../types'
+import { SLIDER_TABS } from '../../types'
 import { generateUrlFromRouterPath } from '../../utils/link-helper.util'
 
 import { ReactComponent as Arrow } from 'igz-controls/images/arrow.svg'
 
-import './tabsSlider.scss'
-
 const TabsSlider = ({
+  fontSize = 'sm',
   initialTab = '',
   isDetailsPopUp = false,
   onClick = () => {},
   skipLink = false,
-  sliderStyle = SLIDER_STYLE_1,
   tabsList
 }) => {
   const [selectedTab, setSelectedTab] = useState(initialTab)
@@ -50,7 +48,6 @@ const TabsSlider = ({
   const menuOffsetHalfWidth = 2
   const tabOffset = 1.5
 
-  const tabsSliderClassNames = classnames('tabs-slider', sliderStyle)
   const leftArrowClassNames = classnames(
     'tabs-slider__arrow',
     'tabs-slider__arrow_left',
@@ -161,7 +158,7 @@ const TabsSlider = ({
   }, [isDetailsPopUp, params.tab, selectedTab, tabsList])
 
   return (
-    <div className={tabsSliderClassNames}>
+    <div className="content-menu">
       <div
         className={leftArrowClassNames}
         onClick={() => {
@@ -170,46 +167,51 @@ const TabsSlider = ({
       >
         <Arrow />
       </div>
-      <div className="tabs-slider__tabs-wrapper" ref={tabsWrapperRef}>
+      <div className="content-menu__tabs-wrapper" ref={tabsWrapperRef}>
         <div
           ref={tabsRef}
-          className="tabs-slider__tabs"
+          className="content-menu__tabs"
           style={{
             transform: `translateX(${-scrolledWidth}px)`
           }}
         >
           {tabsList.map(tab => {
             const tabClassName = classnames(
-              'tabs-slider__tab',
-              selectedTab === tab.id && 'tabs-slider__tab_active'
+              'content-menu__tab',
+              `content-menu__tab-${fontSize}`,
+              selectedTab === tab.id && 'content-menu__tab_active'
             )
 
             return (
               !tab.hidden &&
               (!skipLink ? (
-                <Link
-                  className={tabClassName}
-                  data-tab={tab.id}
-                  to={generateUrlFromRouterPath(
-                    `${window.location.pathname?.replace(/^$|([^/]+$)/, tab.id)}${location.search ?? ''}${tab.query ?? ''}`
-                  )}
-                  onClick={() => onSelectTab(tab)}
-                  key={tab.id}
-                >
-                  {tab.icon && <div className="tabs-slider__tab-icon">{tab.icon}</div>}
-                  {tab.label}
-                  {tab.tip && <Tip className="tabs-slider__tab-tip" text={tab.tip} />}
-                </Link>
+                <div className={tabClassName}>
+                  <Link
+                    className={
+                      (tab.icon && 'content-menu__tab-icon') || (tab.tip && 'content-menu__tab-tip')
+                    }
+                    data-tab={tab.id}
+                    to={generateUrlFromRouterPath(
+                      `${window.location.pathname?.replace(/^$|([^/]+$)/, tab.id)}${location.search ?? ''}${tab.query ?? ''}`
+                    )}
+                    onClick={() => onSelectTab(tab)}
+                    key={tab.id}
+                  >
+                    {tab.icon && <div>{tab.icon}</div>}
+                    {tab.label}
+                    {tab.tip && <Tip text={tab.tip} />}
+                  </Link>
+                </div>
               ) : (
                 <div
                   className={tabClassName}
                   data-tab={tab.id}
                   key={tab.id}
                   onClick={() => onSelectTab(tab.id)}
                 >
-                  {tab.icon && <div className="tabs-slider__tab-icon">{tab.icon}</div>}
+                  {tab.icon && <div className="content-menu_tab-icon">{tab.icon}</div>}
                   {tab.label}
-                  {tab.tip && <Tip className="tabs-slider__tab-tip" text={tab.tip} />}
+                  {tab.tip && <Tip className="content-menu__tab-tip" text={tab.tip} />}
                 </div>
               ))
             )
@@ -224,10 +226,10 @@ const TabsSlider = ({
 }
 
 TabsSlider.propTypes = {
+  fontSize: PropTypes.oneOf(['sm', 'md', 'lg']),
   initialTab: PropTypes.string,
   onClick: PropTypes.func,
   skipLink: PropTypes.bool,
-  sliderStyle: PropTypes.oneOf([SLIDER_STYLE_1, SLIDER_STYLE_2]),
   tabsList: SLIDER_TABS.isRequired
 }