binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-2329] chore: updated UI for module and cycle detail overview (#5435)

Browse source 
* chore: updated UI for module and cycle detail overview

* chore: z-index issue in sheet
This commit is contained in:
guru_sainath 2024-08-27 17:45:17 +05:30 • committed by GitHub
parent 88013e3b06
commit 09209694a4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 6 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/[cycleId]/page.tsx
View file

@ -71,7 +71,7 @@ const CycleDetailPage = observer(() => {
{cycleId && !isSidebarCollapsed && (
<div
className={cn(
"flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm fixed right-0 top-0 z-10"
"flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm absolute right-0 top-0 z-[13]"
)}
style={{
boxShadow:

2
web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/[moduleId]/page.tsx
View file

@ -69,7 +69,7 @@ const ModuleIssuesPage = observer(() => {
{moduleId && !isSidebarCollapsed && (
<div
className={cn(
"flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm fixed right-0 top-0 z-10"
"flex h-full w-[24rem] flex-shrink-0 flex-col gap-3.5 overflow-y-auto border-l border-custom-border-100 bg-custom-sidebar-background-100 px-6 duration-300 vertical-scrollbar scrollbar-sm absolute right-0 top-0 z-[13]"
)}
style={{
boxShadow:

5
web/core/components/cycles/analytics-sidebar/root.tsx
View file

@ -33,7 +33,6 @@ type Props = {
cycleId: string;
handleClose: () => void;
isArchived?: boolean;
isPeekMode?: boolean;
};
const defaultValues: Partial<ICycle> = {
@ -46,7 +45,7 @@ const cycleService = new CycleService();
// TODO: refactor the whole component
export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
const { cycleId, handleClose, isArchived, isPeekMode = false } = props;
const { cycleId, handleClose, isArchived } = props;
// states
const [archiveCycleModal, setArchiveCycleModal] = useState(false);
const [cycleDeleteModal, setCycleDeleteModal] = useState(false);
@ -262,7 +261,7 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
<>
<div
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 ${isPeekMode ? "pt-5" : "pt-20"}`}
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 pt-5`}
>
<div>
<button

1
web/core/components/cycles/cycle-peek-overview.tsx
View file

@ -51,7 +51,6 @@ export const CyclePeekOverview: React.FC<Props> = observer(({ projectId, workspa
cycleId={peekCycle?.toString() ?? ""}
handleClose={handleClose}
isArchived={isArchived}
isPeekMode
/>
</div>
)}

5
web/core/components/modules/analytics-sidebar/root.tsx
View file

@ -63,12 +63,11 @@ 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, isPeekMode = false } = props;
const { moduleId, handleClose, isArchived } = props;
// states
const [moduleDeleteModal, setModuleDeleteModal] = useState(false);
const [archiveModuleModal, setArchiveModuleModal] = useState(false);
@ -311,7 +310,7 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
<DeleteModuleModal isOpen={moduleDeleteModal} onClose={() => setModuleDeleteModal(false)} data={moduleDetails} />
<>
<div
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 ${isPeekMode ? "pt-5" : "pt-20"}`}
className={`sticky z-10 top-0 flex items-center justify-between bg-custom-sidebar-background-100 pb-5 pt-5`}
>
<div>
<button

1
web/core/components/modules/module-peek-overview.tsx
View file

@ -51,7 +51,6 @@ export const ModulePeekOverview: React.FC<Props> = observer(({ projectId, worksp
moduleId={peekModule?.toString() ?? ""}
handleClose={handleClose}
isArchived={isArchived}
isPeekMode
/>
</div>
)}