[WEB-1982] chore: sidebar navigation item refactor (#5184)
* chore: sidebar navigation item refactor * chore: module and cycle sidebar padding adjustment
This commit is contained in:
parent
1956da2b90
commit
2ad1047323
7 changed files with 40 additions and 32 deletions
|
|
@ -33,6 +33,7 @@ type Props = {
|
|||
cycleId: string;
|
||||
handleClose: () => void;
|
||||
isArchived?: boolean;
|
||||
isPeekMode?: boolean;
|
||||
};
|
||||
|
||||
const defaultValues: Partial<ICycle> = {
|
||||
|
|
@ -45,7 +46,7 @@ const cycleService = new CycleService();
|
|||
|
||||
// TODO: refactor the whole component
|
||||
export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
|
||||
const { cycleId, handleClose, isArchived } = props;
|
||||
const { cycleId, handleClose, isArchived, isPeekMode = false } = props;
|
||||
// states
|
||||
const [archiveCycleModal, setArchiveCycleModal] = useState(false);
|
||||
const [cycleDeleteModal, setCycleDeleteModal] = useState(false);
|
||||
|
|
@ -260,7 +261,9 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
|
|||
)}
|
||||
|
||||
<>
|
||||
<div className="sticky z-10 pt-20 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5">
|
||||
<div
|
||||
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 ${isPeekMode ? "pt-5" : "pt-20"}`}
|
||||
>
|
||||
<div>
|
||||
<button
|
||||
className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300"
|
||||
|
|
|
|||
|
|
@ -51,6 +51,7 @@ export const CyclePeekOverview: React.FC<Props> = observer(({ projectId, workspa
|
|||
cycleId={peekCycle?.toString() ?? ""}
|
||||
handleClose={handleClose}
|
||||
isArchived={isArchived}
|
||||
isPeekMode
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -63,11 +63,12 @@ type Props = {
|
|||
moduleId: string;
|
||||
handleClose: () => void;
|
||||
isArchived?: boolean;
|
||||
isPeekMode?: boolean;
|
||||
};
|
||||
|
||||
// TODO: refactor this component
|
||||
export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
|
||||
const { moduleId, handleClose, isArchived } = props;
|
||||
const { moduleId, handleClose, isArchived, isPeekMode = false } = props;
|
||||
// states
|
||||
const [moduleDeleteModal, setModuleDeleteModal] = useState(false);
|
||||
const [archiveModuleModal, setArchiveModuleModal] = useState(false);
|
||||
|
|
@ -309,7 +310,9 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
|
|||
)}
|
||||
<DeleteModuleModal isOpen={moduleDeleteModal} onClose={() => setModuleDeleteModal(false)} data={moduleDetails} />
|
||||
<>
|
||||
<div className="sticky z-10 pt-20 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5">
|
||||
<div
|
||||
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 ${isPeekMode ? "pt-5" : "pt-20"}`}
|
||||
>
|
||||
<div>
|
||||
<button
|
||||
className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-border-300"
|
||||
|
|
|
|||
|
|
@ -51,6 +51,7 @@ export const ModulePeekOverview: React.FC<Props> = observer(({ projectId, worksp
|
|||
moduleId={peekModule?.toString() ?? ""}
|
||||
handleClose={handleClose}
|
||||
isArchived={isArchived}
|
||||
isPeekMode
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue