Remove exp. tracking utils, reducers, styles

Signed-off-by: tynandebold <[email protected]>
kedro-org · Nov 22, 2024 · 6974f07 · 6974f07
1 parent 72ebf34
commit 6974f07
Show file tree

Hide file tree

Showing 18 changed files with 8 additions and 412 deletions.
diff --git a/src/actions/index.js b/src/actions/index.js
@@ -326,36 +326,6 @@ export function toggleBookmark(bookmark, runId) {
   };
 }
 
-export const UPDATE_RUN_TITLE = 'UPDATE_RUN_TITLE';
-
-/**
- * Update Run title
- * @param {String} title
- * @param {string} runId
- */
-export function updateRunTitle(title, runId) {
-  return {
-    type: UPDATE_RUN_TITLE,
-    title,
-    runId,
-  };
-}
-
-export const UPDATE_RUN_NOTES = 'UPDATE_RUN_NOTES';
-
-/**
- * Update Run Notes
- * @param {String} notes
- * @param {string} runId
- */
-export function updateRunNotes(notes, runId) {
-  return {
-    type: UPDATE_RUN_NOTES,
-    notes,
-    runId,
-  };
-}
-
 export const UPDATE_STATE_FROM_OPTIONS = 'UPDATE_STATE_FROM_OPTIONS';
 
 /**

diff --git a/src/components/app/app.scss b/src/components/app/app.scss
@@ -25,24 +25,6 @@
   --color-base-20: #{colors.$grey-300};
   --color-black-10: #{colors.$white-200};
   --color-border-line: #{colors.$white-500};
-
-  // Experiment tracking colors below
-  --color-exp-tracking-bg: #{colors.$white-0};
-  --color-exp-tracking-metadata: #{colors.$white-0};
-  --color-exp-tracking-datasets: #{colors.$white-100};
-  --color-metrics-plot-text: #{colors.$grey-200};
-  --color-metrics-plot-text-bold: #{colors.$black-900};
-  --color-metrics-plot-axis-ends: #{colors.$grey-800};
-  --color-metrics-plot-parallel-coords-line: #{colors.$white-200};
-  --color-metrics-plot-parallel-coords-line-hover: #{colors.$black-0};
-  --color-metrics-plot-parallel-coords-axis-hover: #{colors.$grey-800};
-  --color-metrics-plot-tooltip-value: #{colors.$white-0};
-  --color-metrics-plot-tooltip-label: #{colors.$grey-300};
-  --color-metrics-plot-time-series-metric-line: #{colors.$grey-200};
-  --color-metrics-plot-time-series-axis: #{colors.$grey-300};
-  --color-metrics-plot-time-series-run-line: #{colors.$grey-100};
-  --color-metrics-plot-time-series-run-line-hovered: #{colors.$black-0};
-  --color-metrics-plot-time-series-dotted-line: #{colors.$grey-600};
 }
 
 .kui-theme--dark {
@@ -67,24 +49,6 @@
   --color-run-list-hover: #{colors.$slate-0};
   --color-base-20: #{colors.$grey-800};
   --color-black-10: #{colors.$slate-700};
-
-  // Experiment tracking colors below
-  --color-exp-tracking-bg: #{colors.$slate-900};
-  --color-exp-tracking-metadata: #{colors.$slate-800};
-  --color-exp-tracking-datasets: #{colors.$black-850};
-  --color-metrics-plot-text: #{colors.$grey-900};
-  --color-metrics-plot-text-bold: #{colors.$white-0};
-  --color-metrics-plot-axis-ends: #{colors.$grey-300};
-  --color-metrics-plot-parallel-coords-line: #{colors.$slate-300};
-  --color-metrics-plot-parallel-coords-line-hover: #{colors.$grey-400};
-  --color-metrics-plot-parallel-coords-axis-hover: #{colors.$white-900};
-  --color-metrics-plot-tooltip-value: #{colors.$black-900};
-  --color-metrics-plot-tooltip-label: #{colors.$black-500};
-  --color-metrics-plot-time-series-metric-line: #{colors.$grey-700};
-  --color-metrics-plot-time-series-axis: #{colors.$grey-900};
-  --color-metrics-plot-time-series-run-line: #{colors.$slate-200};
-  --color-metrics-plot-time-series-run-line-hovered: #{colors.$white-0};
-  --color-metrics-plot-time-series-dotted-line: #{colors.$grey-500};
 }
 
 .kedro {

diff --git a/src/components/experiment-warning/experiment-warning.js b/src/components/experiment-warning/experiment-warning.js
diff --git a/src/components/experiment-warning/experiment-warning.scss b/src/components/experiment-warning/experiment-warning.scss
diff --git a/src/components/experiment-warning/index.js b/src/components/experiment-warning/index.js
diff --git a/src/components/flowchart-wrapper/flowchart-wrapper.js b/src/components/flowchart-wrapper/flowchart-wrapper.js
@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useCallback, useRef } from 'react';
-import { useHistory, useLocation } from 'react-router-dom';
+import { useLocation } from 'react-router-dom';
 import { connect } from 'react-redux';
 import classnames from 'classnames';
 import { isLoading } from '../../selectors/loading';
@@ -24,13 +24,9 @@ import MetaData from '../metadata';
 import MetadataModal from '../metadata-modal';
 import ShareableUrlMetadata from '../shareable-url-modal/shareable-url-metadata';
 import Sidebar from '../sidebar';
-import Button from '../ui/button';
-import CircleProgressBar from '../ui/circle-progress-bar';
 import { loadLocalStorage, saveLocalStorage } from '../../store/helpers';
 import {
   errorMessages,
-  linkToFlowchartInitialVal,
-  localStorageFlowchartLink,
   localStorageName,
   localStorageBannerStatus,
   params,
@@ -54,7 +50,6 @@ export const FlowChartWrapper = ({
   displaySidebar,
   graph,
   loading,
-  metadataVisible,
   modularPipelinesTree,
   nodes,
   onToggleFocusMode,
@@ -72,7 +67,6 @@ export const FlowChartWrapper = ({
   displayExportBtn,
   displayBanner,
 }) => {
-  const history = useHistory();
   const { pathname, search } = useLocation();
   const searchParams = new URLSearchParams(search);
   const { toSetQueryParam } = useGeneratePathname();
@@ -81,10 +75,6 @@ export const FlowChartWrapper = ({
   const [isInvalidUrl, setIsInvalidUrl] = useState(false);
   const [usedNavigationBtn, setUsedNavigationBtn] = useState(false);
 
-  const [counter, setCounter] = useState(60);
-  const [goBackToExperimentTracking, setGoBackToExperimentTracking] =
-    useState(false);
-
   const graphRef = useRef(null);
 
   const {
@@ -232,10 +222,6 @@ export const FlowChartWrapper = ({
     };
   }, [handlePopState]);
 
-  useEffect(() => {
-    setGoBackToExperimentTracking(loadLocalStorage(localStorageFlowchartLink));
-  }, []);
-
   /**
    * To handle redirecting to a different location via the URL (e.g. selectedNode,
    * focusNode, etc.) we only need to call the matchPath actions when:
@@ -280,37 +266,6 @@ export const FlowChartWrapper = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [graph, usedNavigationBtn, isInvalidUrl]);
 
-  const resetLinkingToFlowchartLocalStorage = useCallback(() => {
-    saveLocalStorage(localStorageFlowchartLink, linkToFlowchartInitialVal);
-
-    setGoBackToExperimentTracking(linkToFlowchartInitialVal);
-  }, []);
-
-  useEffect(() => {
-    if (goBackToExperimentTracking?.showGoBackBtn) {
-      const timer =
-        counter > 0 && setInterval(() => setCounter(counter - 1), 1000);
-
-      if (counter === 0) {
-        resetLinkingToFlowchartLocalStorage();
-      }
-
-      return () => clearInterval(timer);
-    }
-  }, [
-    counter,
-    goBackToExperimentTracking?.showGoBackBtn,
-    resetLinkingToFlowchartLocalStorage,
-  ]);
-
-  const onGoBackToExperimentTrackingHandler = () => {
-    const url = goBackToExperimentTracking.fromURL;
-
-    history.push(url);
-
-    resetLinkingToFlowchartLocalStorage();
-  };
-
   const handleBannerClose = (bannerKey) => {
     saveLocalStorage(localStorageBannerStatus, { [bannerKey]: false });
   };
@@ -355,21 +310,6 @@ export const FlowChartWrapper = ({
         <div className="pipeline-wrapper">
           <PipelineWarning />
           <FlowChart />
-          <div
-            className={classnames('pipeline-wrapper__go-back-btn', {
-              'pipeline-wrapper__go-back-btn--show':
-                goBackToExperimentTracking?.showGoBackBtn,
-              'pipeline-wrapper__go-back-btn--show-sidebar-visible':
-                sidebarVisible,
-              'pipeline-wrapper__go-back-btn--show-metadata-visible':
-                metadataVisible,
-            })}
-          >
-            <Button onClick={onGoBackToExperimentTrackingHandler}>
-              <CircleProgressBar>{counter}</CircleProgressBar>
-              Return to Experiment Tracking
-            </Button>
-          </div>
           <div
             className={classnames('pipeline-wrapper__loading', {
               'pipeline-wrapper__loading--sidebar-visible': sidebarVisible,

diff --git a/src/components/metadata/metadata.js b/src/components/metadata/metadata.js
@@ -19,14 +19,10 @@ import {
 import { toggleNodeClicked } from '../../actions/nodes';
 import { toggleCode, togglePlotModal } from '../../actions';
 import getShortType from '../../utils/short-type';
-import {
-  useGeneratePathname,
-  useGeneratePathnameForExperimentTracking,
-} from '../../utils/hooks/use-generate-pathname';
+import { useGeneratePathname } from '../../utils/hooks/use-generate-pathname';
 
 import './styles/metadata.scss';
 import MetaDataStats from './metadata-stats';
-import { isRunningLocally } from '../../utils';
 
 /**
  * Shows node meta data
@@ -43,8 +39,6 @@ const MetaData = ({
   showDatasetPreviews,
 }) => {
   const { toSelectedPipeline } = useGeneratePathname();
-  const { toExperimentTrackingPath, toMetricsViewPath } =
-    useGeneratePathnameForExperimentTracking();
 
   // Hide code panel when selected metadata changes
   useEffect(() => onToggleCode(false), [metadata, onToggleCode]);
@@ -321,23 +315,6 @@ const MetaData = ({
                   </button>
                 </>
               )}
-              {isRunningLocally()
-                ? hasTrackingData && (
-                    <button
-                      className="pipeline-metadata__link"
-                      onClick={
-                        isMetricsTrackingDataset
-                          ? toMetricsViewPath
-                          : toExperimentTrackingPath
-                      }
-                    >
-                      <ExpandIcon className="pipeline-metadata__link-icon"></ExpandIcon>
-                      <span className="pipeline-metadata__link-text">
-                        Open in Experiment Tracking
-                      </span>
-                    </button>
-                  )
-                : null}
               {hasTablePreview && (
                 <>
                   <div className="pipeline-metadata__preview">

diff --git a/src/components/metadata/metadata.test.js b/src/components/metadata/metadata.test.js
@@ -425,13 +425,6 @@ describe('MetaData', () => {
           expect.stringContaining('3 items')
         );
       });
-      it('shows the experiment link', () => {
-        const wrapper = mount({
-          nodeId: modelInputDatasetNodeId,
-          mockMetadata: nodeMetricsData,
-        });
-        expect(wrapper.find('.pipeline-metadata__link').length).toBe(1);
-      });
     });
 
     describe('JSON dataset nodes', () => {
@@ -445,13 +438,6 @@ describe('MetaData', () => {
           expect.stringContaining('3 items')
         );
       });
-      it('shows the experiment link', () => {
-        const wrapper = mount({
-          nodeId: modelInputDatasetNodeId,
-          mockMetadata: nodeJSONData,
-        });
-        expect(wrapper.find('.pipeline-metadata__link').length).toBe(1);
-      });
     });
 
     describe('Plot nodes', () => {

diff --git a/src/components/primary-toolbar/primary-toolbar.js b/src/components/primary-toolbar/primary-toolbar.js
@@ -6,7 +6,7 @@ import MenuIcon from '../icons/menu';
 import './primary-toolbar.scss';
 
 /**
- * Toolbar to house buttons that controls display options for the main panel (flowchart, experiment details, etc)
+ * Toolbar to house buttons that controls display options for the main panel (flowchart, etc)
  * @param {JSX} children The content to be rendered within the toolbar
  * @param {Function} onToggleSidebar Handle toggling of sidebar collapsable view
  * @param {Boolean} visible Handle display of tooltip text in relation to collapsable view

diff --git a/src/components/sidebar/sidebar.scss b/src/components/sidebar/sidebar.scss
@@ -61,10 +61,6 @@
     visibility: visible;
     transition: visibility 0s;
   }
-
-  &--experiment-tracking {
-    overflow-y: scroll;
-  }
 }
 
 .pipeline-toolbar {

diff --git a/src/config.js b/src/config.js
@@ -3,7 +3,6 @@ import { sanitizedPathname } from './utils';
 export const localStorageName = 'KedroViz';
 export const localStorageFlowchartLink = 'KedroViz-link-to-flowchart';
 export const localStorageMetricsSelect = 'KedroViz-metrics-chart-select';
-export const localStorageRunsMetadata = 'KedroViz-runs-metadata';
 export const localStorageShareableUrl = 'KedroViz-shareable-url';
 export const localStorageFeedbackSeen = 'KedroViz-feedback-seen';
 export const localStorageBannerStatus = 'KedroViz-banners';
@@ -123,19 +122,12 @@ export const routes = {
     selectedName: `${pathname}?${activePipeline}&${params.selectedName}=:fullName`,
     selectedPipeline: `${pathname}?${activePipeline}`,
   },
-  experimentTracking: {
-    main: `${pathname}experiment-tracking`,
-    selectedView: `${pathname}experiment-tracking?${params.view}=:view`,
-    selectedRuns: `${pathname}experiment-tracking?${params.run}=:ids&${params.view}=:view&${params.comparisonMode}=:isComparison`,
-  },
 };
 
 export const errorMessages = {
   node: 'Please check the value of "selected_id"/"sid" or "selected_name"/"sn" in the URL',
   modularPipeline: 'Please check the value of "focused_id"/"fid" in the URL',
   pipeline: 'Please check the value of "pipeline_id"/"pid" in the URL',
-  experimentTracking: `Please check the spelling of "run_ids" or "view" or "comparison" in the URL. It may be a typo 😇`,
-  runIds: `Please check the value of "run_ids" in the URL. Perhaps you've deleted the entity 🙈 or it may be a typo 😇`,
 };
 
 export const datasetStatLabels = ['rows', 'columns', 'file_size'];
@@ -167,9 +159,6 @@ export const inputKeyToStateKeyMap = {
   endpoint: 'hasEndpoint',
 };
 
-export const RUN_TITLE = 'title';
-export const RUN_NOTES = 'notes';
-
 export const PACKAGE_FSSPEC = 'fsspec';
 export const PACKAGE_KEDRO_DATASETS = 'kedro-datasets';
 

diff --git a/src/reducers/index.js b/src/reducers/index.js
@@ -1,5 +1,4 @@
 import { combineReducers } from 'redux';
-import runsMetadata from './runs-metadata';
 import flags from './flags';
 import graph from './graph';
 import layer from './layers';
@@ -84,7 +83,6 @@ const combinedReducer = combineReducers({
   tag,
   modularPipeline,
   visible,
-  runsMetadata,
   showBanner: bannerReducer,
   // These props don't have any actions associated with them
   display: createReducer(null),