Removing version filters from versioning side panel. (#1364)

openmetadata-ui/src/main/resources/ui/src/components/EntityVersionTimeLine/EntityVersionTimeLine.tsx

@@ -1,12 +1,8 @@
 import classNames from 'classnames';
 import { capitalize, toString } from 'lodash';
 import React, { Fragment, useState } from 'react';
-import { versionTypes } from '../../constants/constants';
 import { EntityHistory } from '../../generated/type/entityHistory';
 import { getSummary, isMajorVersion } from '../../utils/EntityVersionUtils';
-import { dropdownIcon as DropDownIcon } from '../../utils/svgconstant';
-import { Button } from '../buttons/Button/Button';
-import DropDownList from '../dropdown/DropDownList';
 
 type Props = {
   versionList: EntityHistory;
@@ -24,8 +20,7 @@ const EntityVersionTimeLine: React.FC<Props> = ({
   versionHandler,
   onBack,
 }: Props) => {
-  const [listVisible, setListVisible] = useState(false);
+  const [versionType] = useState<VersionType>('all');
-  const [versionType, setVersionType] = useState<VersionType>('all');
   const getVersionList = () => {
     let versionTypeList = [];
     const list = versionList.versions ?? [];
@@ -92,9 +87,15 @@ const EntityVersionTimeLine: React.FC<Props> = ({
               onClick={() => versionHandler(toString(currV?.version))}>
               <div className="timeline-wrapper">
                 <span
-                  className={classNames('timeline-rounder', {
+                  className={classNames(
-                    selected: toString(currV?.version) === currentVersion,
+                    'timeline-rounder',
-                  })}
+                    {
+                      selected: toString(currV?.version) === currentVersion,
+                    },
+                    {
+                      major: majorVersionChecks(),
+                    }
+                  )}
                   data-testid="select-version"
                 />
                 <span className={classNames('timeline-line')} />
@@ -137,40 +138,10 @@ const EntityVersionTimeLine: React.FC<Props> = ({
     );
   };
 
-  const handleVersionTypeSelection = (
-    _e: React.MouseEvent<HTMLElement, MouseEvent>,
-    value?: string
-  ) => {
-    if (value) {
-      setVersionType(value as VersionType);
-    }
-    setListVisible(false);
-  };
-
   return (
     <div className={classNames('timeline-drawer', { open: show })}>
       <header className="tw-flex tw-justify-between">
-        <div className="tw-flex">
+        <p className="tw-font-medium tw-mr-2">Versions History</p>
-          <p className="tw-font-medium tw-mr-2">Versions History</p>
-          <Button
-            className="tw-bg-primary-hover-lite tw-px-2 tw-rounded"
-            data-testid="versiontype-dropdown"
-            size="custom"
-            theme="primary"
-            variant="text"
-            onClick={() => setListVisible((visible) => !visible)}>
-            {capitalize(versionType)}
-            <DropDownIcon style={{ marginTop: '2px', height: '15px' }} />
-          </Button>
-          {listVisible && (
-            <DropDownList
-              className="tw-ml-24 tw-top-11"
-              dropDownList={versionTypes}
-              value={versionType}
-              onSelect={handleVersionTypeSelection}
-            />
-          )}
-        </div>
         <div className="tw-flex" onClick={onBack}>
           <svg
             className="tw-w-5 tw-h-5 tw-ml-1 tw-cursor-pointer"

openmetadata-ui/src/main/resources/ui/src/styles/x-custom/EntityVersionTimeLine.css

@@ -31,13 +31,14 @@
   border-radius: 50%;
   margin-top: 0.15rem;
 }
-.timeline-rounder.major {
+.timeline-rounder.major,
-  width: 20px;
+.timeline-rounder.major.selected {
-  height: 20px;
+  border-color: #f9816c;
 }
 .timeline-rounder.selected {
   border: 3px solid #7147e8;
 }
+
 .timeline-rounder.selected::after {
   content: '';
   display: block;
@@ -49,8 +50,8 @@
   background-color: #7147e8;
 }
 .timeline-rounder.major.selected::after {
-  width: 10px;
+  border-color: #f9816c;
-  height: 10px;
+  background-color: #f9816c;
 }
 
 .timeline-line {