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

This commit is contained in:
Sachin Chaurasiya 2021-11-24 17:38:07 +05:30 committed by GitHub
parent a180adc39c
commit 2f64b04321
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 45 deletions

View File

@ -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, setVersionType] = useState<VersionType>('all');
const [versionType] = 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(
'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>
<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"

View File

@ -31,13 +31,14 @@
border-radius: 50%;
margin-top: 0.15rem;
}
.timeline-rounder.major {
width: 20px;
height: 20px;
.timeline-rounder.major,
.timeline-rounder.major.selected {
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;
height: 10px;
border-color: #f9816c;
background-color: #f9816c;
}
.timeline-line {