Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(side-panel): Add functionality of order tables by drag & drop #425

Merged
merged 3 commits into from
Nov 28, 2024
Merged

feat(side-panel): Add functionality of order tables by drag & drop #425

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5a42200
The functionality of dragging and dropping DB
Zer0S2m Nov 19, 2024
8ef5a01
Fixed scaling of the table during drag and drop
Zer0S2m Nov 19, 2024
bc66315
one sorting table function and a few changes
guyb1 Nov 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Fixed scaling of the table during drag and drop
  • Loading branch information
@Zer0S2m @guyb1
Zer0S2m authored and guyb1 committed Nov 27, 2024
commit 8ef5a018a8505b4add32e87620f808b1467a82a2
15 changes: 13 additions & 2 deletions ...ages/editor-page/side-panel/tables-section/table-list/table-list-item/table-list-item.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,23 @@ import { TableListItemHeader } from './table-list-item-header/table-list-item-he
import { TableListItemContent } from './table-list-item-content/table-list-item-content';
import type { DBTable } from '@/lib/domain/db-table';
import { useSortable } from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
import type { Transform } from '@dnd-kit/utilities';

export interface TableListItemProps {
table: DBTable;
}

const collectTransform = (transform: Transform | null): string => {
if (transform == null) {
return '';
}

const defaultScaleX: string = 'scaleX(1)';
const defaultScaleY: string = 'scaleY(1)';

return `translate3d(${transform.x}px, ${transform.y}px, 0px) ${defaultScaleX} ${defaultScaleY}`;
};

export const TableListItem = React.forwardRef<
React.ElementRef<typeof AccordionItem>,
TableListItemProps
Expand All @@ -22,7 +33,7 @@ export const TableListItem = React.forwardRef<
id: table.id,
});
const style = {
transform: CSS.Transform.toString(transform),
transform: collectTransform(transform),
transition,
};

Expand Down