merged development

mlrun · Oct 30, 2023 · 128f20a · 128f20a
2 parents 8ab8302 + f2e6453
commit 128f20a
Show file tree

Hide file tree

Showing 64 changed files with 1,133 additions and 1,002 deletions.
diff --git a/package.json b/package.json
@@ -24,7 +24,7 @@
     "final-form-arrays": "^3.0.2",
     "fs-extra": "^10.0.0",
     "identity-obj-proxy": "^3.0.0",
-    "iguazio.dashboard-react-controls": "1.5.1",
+    "iguazio.dashboard-react-controls": "1.7.0",
     "is-wsl": "^1.1.0",
     "js-base64": "^2.5.2",
     "js-yaml": "^3.13.1",

diff --git a/src/actions/details.js b/src/actions/details.js
@@ -30,6 +30,7 @@ import {
   FETCH_MODEL_FEATURE_VECTOR_SUCCESS,
   REMOVE_INFO_CONTENT,
   REMOVE_JOB_PODS,
+  REMOVE_MODEL_ENDPOINT,
   REMOVE_MODEL_FEATURE_VECTOR,
   RESET_CHANGES,
   SET_CHANGES,
@@ -124,6 +125,9 @@ const detailsActions = {
   removeInfoContent: () => ({
     type: REMOVE_INFO_CONTENT
   }),
+  removeModelEndpoint: () => ({
+    type: REMOVE_MODEL_ENDPOINT
+  }),
   removeModelFeatureVector: () => ({
     type: REMOVE_MODEL_FEATURE_VECTOR
   }),

diff --git a/src/common/Accordion/Accordion.js b/src/common/Accordion/Accordion.js
@@ -63,17 +63,9 @@ const Accordion = ({
     !alwaysOpened && setOpen(state => !state)
   }
 
-  const accordionClassNames = classnames(
-    'accordion__container',
-    open && 'open',
-    accordionClassName
-  )
+  const accordionClassNames = classnames('accordion__container', open && 'open', accordionClassName)
 
-  const iconClassNames = classnames(
-    'accordion__icon',
-    iconClassName,
-    open && 'open'
-  )
+  const iconClassNames = classnames('accordion__icon', iconClassName, open && 'open')
 
   return (
     <div
@@ -83,11 +75,7 @@ const Accordion = ({
       ref={accordionRef}
     >
       {icon && (
-        <RoundedIcon
-          data-testid="accordion-btn"
-          onClick={handleOpenAccordion}
-          className={iconClassNames}
-        >
+        <RoundedIcon id="accordion-btn" onClick={handleOpenAccordion} className={iconClassNames}>
           {icon}
         </RoundedIcon>
       )}

diff --git a/src/common/ActionsMenu/ActionsMenu.js b/src/common/ActionsMenu/ActionsMenu.js
@@ -126,6 +126,7 @@ const ActionsMenu = ({ dataItem, menu, time, withQuickActions }) => {
           {actionMenu[1].map(mainAction => (
             <RoundedIcon
               disabled={mainAction.disabled}
+              id={`quick-link-${mainAction.id}`}
               onClick={() => mainAction.onClick(dataItem)}
               tooltipText={mainAction.label}
               key={mainAction.label}
@@ -135,7 +136,12 @@ const ActionsMenu = ({ dataItem, menu, time, withQuickActions }) => {
           ))}
         </div>
       )}
-      <RoundedIcon isActive={isShowMenu} onClick={showActionsList} ref={actionMenuBtnRef}>
+      <RoundedIcon
+        isActive={isShowMenu}
+        id="actions-menu"
+        onClick={showActionsList}
+        ref={actionMenuBtnRef}
+      >
         <ActionMenuIcon />
       </RoundedIcon>
       {renderMenu &&

diff --git a/src/common/ActionsMenu/actionsMenu.scss b/src/common/ActionsMenu/actionsMenu.scss
@@ -9,7 +9,7 @@
 
     &_extended {
       position: absolute;
-      right: 0;
+      right: 5px;
       display: none;
       align-items: center;
       justify-content: center;
@@ -22,14 +22,13 @@
         position: absolute;
         display: block;
         left: -30px;
-        background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(245,247,255,1) 100%);
+        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(245, 247, 255, 1) 100%);
       }
     }
 
     &-active {
       display: flex;
     }
-
   }
 
   &__main-actions-wrapper {

diff --git a/src/common/Breadcrumbs/Breadcrumbs.js b/src/common/Breadcrumbs/Breadcrumbs.js
@@ -202,7 +202,7 @@ const Breadcrumbs = ({ onClick, projectStore, fetchProjectsNames }) => {
               <li key={i} className="breadcrumbs__item">
                 <RoundedIcon
                   className={separatorClassNames}
-                  data-testid="separator"
+                  id="separator"
                   ref={separatorRef}
                   onClick={() => handleSeparatorClick(urlItems.pathItems[i + 1], separatorRef)}
                 >

diff --git a/src/common/KeyValueTable/KeyValueTableView.js b/src/common/KeyValueTable/KeyValueTableView.js
@@ -171,13 +171,15 @@ const KeyValueTableView = ({
                       (selectedItem.newKey !== selectedItem.key &&
                         isKeyNotUnique(selectedItem.newKey, content)))
                   }
+                  id="key-value-table-apply"
                   onClick={handleEditItem}
                   tooltipText="Apply"
                 >
                   <Checkmark />
                 </RoundedIcon>
                 <RoundedIcon
                   className="key-value-table__btn"
+                  id="key-value-table-close"
                   onClick={handleResetForm}
                   tooltipText="Discard changes"
                 >
@@ -218,6 +220,7 @@ const KeyValueTableView = ({
               <div className="table-cell table-cell__actions">
                 <RoundedIcon
                   className="key-value-table__btn"
+                  id="key-value-table-edit"
                   onClick={event => {
                     event.preventDefault()
                   }}
@@ -228,6 +231,7 @@ const KeyValueTableView = ({
 
                 <RoundedIcon
                   className="key-value-table__btn"
+                  id="key-value-table-delete"
                   onClick={event => {
                     event.stopPropagation()
                     deleteItem(index, contentItem)
@@ -297,6 +301,7 @@ const KeyValueTableView = ({
             <RoundedIcon
               className="btn-add"
               disabled={isKeyNotUnique(keyValue, content)}
+              id="key-value-table-apply"
               onClick={saveItem}
               tooltipText="Apply"
             >
@@ -305,6 +310,7 @@ const KeyValueTableView = ({
 
             <RoundedIcon
               className="btn-add"
+              id="key-value-table-discard"
               onClick={handleResetForm}
               tooltipText="Discard changes"
             >

diff --git a/src/common/ProjectDetailsHeader/ProjectDetailsHeader.js b/src/common/ProjectDetailsHeader/ProjectDetailsHeader.js
@@ -58,11 +58,11 @@ const ProjectDetailsHeader = ({ projectData, projectName }) => {
           <li>
             {location.pathname.includes(PROJECT_MONITOR) ? (
               <Link to={`/projects/${projectName}/${PROJECT_QUICK_ACTIONS_PAGE}`} className="link">
-                Project Quick Actions
+                Project quick actions
               </Link>
             ) : (
               <Link to={`/projects/${projectName}/${PROJECT_MONITOR}`} className="link">
-                Project Monitoring
+                Project monitoring
               </Link>
             )}
           </li>

diff --git a/src/components/ArtifactInfoSources/ArtifactInfoSources.js b/src/components/ArtifactInfoSources/ArtifactInfoSources.js
@@ -17,90 +17,34 @@ illegal under applicable law, and the grant of the foregoing license
 under the Apache 2.0 license is conditioned upon your compliance with
 such restriction.
 */
-import React, { useState, useEffect, useMemo } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
-import classnames from 'classnames'
 
 import { Tooltip, TextTooltipTemplate } from 'igz-controls/components'
 
-import { artifactInfoSourcesHeaders } from './artifactInfoSources.utils'
-
 import './artifactInfoSources.scss'
 
-import { ReactComponent as Arrow } from 'igz-controls/images/arrow.svg'
-
-const ArtifactInfoSources = ({ header, sources }) => {
-  const [isExpanded, setIsExpanded] = useState(false)
-
-  const sourcesLength = useMemo(() => {
-    return Object.values(sources).length
-  }, [sources])
-
-  const sourcesClassNames = classnames(
-    'info-sources',
-    isExpanded && 'info-sources_expanded'
-  )
-  const sourcesRowClassNames = classnames(
-    'info-sources-row',
-    sourcesLength === 0 && 'info-sources-row_empty'
-  )
-
-  useEffect(() => {
-    if (sourcesLength === 0) {
-      setIsExpanded(false)
-    }
-  }, [sourcesLength, isExpanded])
+const ArtifactInfoSources = ({ sources }) => {
   return (
-    <div className={sourcesClassNames}>
-      <div
-        className={sourcesRowClassNames}
-        onClick={() => {
-          if (sourcesLength !== 0) setIsExpanded(prevState => !prevState)
-        }}
-      >
-        {sourcesLength !== 0 && (
-          <Arrow className={isExpanded ? 'expanded' : 'collapsed'} />
-        )}
-
-        <div className="info-sources-row__header">{header}</div>
-        <div className="info-sources-row__data">
-          {`${Object.values(sources).length} ${
-            Object.values(sources).length <= 1 ? 'item' : 'items'
-          }`}
-        </div>
-      </div>
-
-      {isExpanded && (
-        <div className="info-sources-table">
-          <div className="info-sources-table__header">
-            {artifactInfoSourcesHeaders.map(({ label, id, className }) => {
-              const tableItemClassNames = classnames(
-                'info-sources-table__header-item',
-                className
-              )
-
-              return (
-                <div key={id} className={tableItemClassNames}>
-                  {label}
-                </div>
-              )
-            })}
+    <div className="info-sources" data-testid="sources">
+      <h3 className="item-info__header">Sources</h3>
+      {Object.entries(sources).map(([key, value], index) => (
+        <div className="info-sources__table" key={key + value}>
+          <h5 className="info-sources__table-header">Source {index + 1}</h5>
+          <div className="info-sources__table-row">
+            <div className="info-sources__table-key">Name</div>
+            <div className="info-sources__table-value">
+              <Tooltip template={<TextTooltipTemplate text={key} />}>{key}</Tooltip>
+            </div>
           </div>
-          {Object.entries(sources).map(([key, value], index) => (
-            <div
-              key={`${key}-${index}`}
-              className="info-sources-table__content"
-            >
-              <div className="info-sources-table__content-key">
-                <Tooltip template={<TextTooltipTemplate text={key} />}>
-                  {key}
-                </Tooltip>
-              </div>
-              <div className="info-sources-table__content-value">{value}</div>
+          <div className="info-sources__table-row">
+            <div className="info-sources__table-key">Path</div>
+            <div className="info-sources__table-value">
+              <Tooltip template={<TextTooltipTemplate text={value} />}>{value}</Tooltip>
             </div>
-          ))}
+          </div>
         </div>
-      )}
+      ))}
     </div>
   )
 }
@@ -110,8 +54,7 @@ ArtifactInfoSources.defaultProps = {
 }
 
 ArtifactInfoSources.propTypes = {
-  header: PropTypes.string.isRequired,
-  sources: PropTypes.shape({})
+  sources: PropTypes.shape({}).isRequired
 }
 
 export default ArtifactInfoSources