diff --git a/front/src/components/DraggablePostsList.module.scss b/front/src/components/DraggablePostsList.module.scss
index 012efb0..33e960c 100644
--- a/front/src/components/DraggablePostsList.module.scss
+++ b/front/src/components/DraggablePostsList.module.scss
@@ -7,6 +7,12 @@
span {
display: flex;
align-items: center;
+ svg {
+ height: 100%;
+ width: 1rem;
+ padding-right: 1rem;
+ cursor: grab;
+ }
}
.posts {
diff --git a/front/src/components/DraggablePostsList.tsx b/front/src/components/DraggablePostsList.tsx
index babaabf..07bc456 100644
--- a/front/src/components/DraggablePostsList.tsx
+++ b/front/src/components/DraggablePostsList.tsx
@@ -3,6 +3,7 @@ import { DataRow } from '../api/DataRow';
import { Post } from './display/Post';
import style from './DraggablePostsList.module.scss';
+import { GripVertical } from './display/GripVertical';
type SetRowsFunction = (data: DataRow[]) => void;
@@ -10,7 +11,7 @@ function PostDraggableListItem({ item, dragHandleProps, rows, setRows }: { item:
function onChange() {
rows.splice(rows.indexOf(item), 1);
- setRows(rows);
+ setRows([ ...rows ]);
}
return (
@@ -18,8 +19,9 @@ function PostDraggableListItem({ item, dragHandleProps, rows, setRows }: { item:
+
-
+
)
}
@@ -36,7 +38,6 @@ export function DraggablePostsList(props: DraggablePostsList) {
template={p => PostDraggableListItem({ ...p, setRows: props.setRows, rows: props.rows })}
list={props.rows}
onMoveEnd={rows => props.setRows([ ...rows ])}
-
/>
);
}
\ No newline at end of file
diff --git a/front/src/components/display/GripVertical.tsx b/front/src/components/display/GripVertical.tsx
new file mode 100644
index 0000000..7d7debe
--- /dev/null
+++ b/front/src/components/display/GripVertical.tsx
@@ -0,0 +1,9 @@
+import type React from "preact/compat";
+
+export function GripVertical(props: React.JSX.SVGAttributes) {
+ return (
+
+ )
+}
\ No newline at end of file