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

[WEB-1005] chore: pragmatic drag n drop implementation for labels (#4223)

Browse source 
* pragmatic drag n drop implementation for labels

* minor code quality improvements
This commit is contained in:
rahulramesha 2024-04-17 18:20:02 +05:30 • committed by GitHub
parent 68c870b791
commit 10ed12e589
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 517 additions and 334 deletions
Download patch file Download diff file Expand all files Collapse all files

21
web/pages/[workspaceSlug]/projects/[projectId]/settings/labels.tsx
View file

@ -1,4 +1,6 @@
import { ReactElement } from "react";
import { ReactElement, useEffect, useRef } from "react";
import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
import { autoScrollForElements } from "@atlaskit/pragmatic-drag-and-drop-auto-scroll/element";
import { observer } from "mobx-react";
// layouts
import { PageHead } from "@/components/core";
@ -16,10 +18,25 @@ const LabelsSettingsPage: NextPageWithLayout = observer(() => {
const { currentProjectDetails } = useProject();
const pageTitle = currentProjectDetails?.name ? `${currentProjectDetails?.name} - Labels` : undefined;
const scrollableContainerRef = useRef<HTMLDivElement | null>(null);
// Enable Auto Scroll for Labels list
useEffect(() => {
const element = scrollableContainerRef.current;
if (!element) return;
return combine(
autoScrollForElements({
element,
})
);
}, [scrollableContainerRef?.current]);
return (
<>
<PageHead title={pageTitle} />
<div className="h-full w-full gap-10 overflow-y-auto py-8 pr-9">
<div ref={scrollableContainerRef} className="h-full w-full gap-10 overflow-y-auto py-8 pr-9">
<ProjectSettingsLabelList />
</div>
</>