misterkirill/Notra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add block movement

Browse Source
This commit is contained in:
Kirill Siukhin 2025-07-15 19:57:35 +05:00
parent 753fb225e1
commit 3421800ede
4 changed files with 142 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

125
package-lock.json generated
View File

@ -2226,9 +2226,9 @@
"license": "MIT"
},
"node_modules/@types/node": {
"version": "20.19.7",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.7.tgz",
"integrity": "sha512-1GM9z6BJOv86qkPvzh2i6VW5+VVrXxCLknfmTkWEqz+6DqosiY28XUWCTmBcJ0ACzKqx/iwdIREfo1fwExIlkA==",
"version": "20.19.8",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.8.tgz",
"integrity": "sha512-HzbgCY53T6bfu4tT7Aq3TvViJyHjLjPNaAS3HOuMc9pw97KHsUtXNX4L+wu59g1WnjsZSko35MbEqnO58rihhw==",
"dev": true,
"license": "MIT",
"dependencies": {
@ -2256,17 +2256,17 @@
}
},
"node_modules/@typescript-eslint/eslint-plugin": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.36.0.tgz",
"integrity": "sha512-lZNihHUVB6ZZiPBNgOQGSxUASI7UJWhT8nHyUGCnaQ28XFCw98IfrMCG3rUl1uwUWoAvodJQby2KTs79UTcrAg==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.37.0.tgz",
"integrity": "sha512-jsuVWeIkb6ggzB+wPCsR4e6loj+rM72ohW6IBn2C+5NCvfUVY8s33iFPySSVXqtm5Hu29Ne/9bnA0JmyLmgenA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@eslint-community/regexpp": "^4.10.0",
"@typescript-eslint/scope-manager": "8.36.0",
"@typescript-eslint/type-utils": "8.36.0",
"@typescript-eslint/utils": "8.36.0",
"@typescript-eslint/visitor-keys": "8.36.0",
"@typescript-eslint/scope-manager": "8.37.0",
"@typescript-eslint/type-utils": "8.37.0",
"@typescript-eslint/utils": "8.37.0",
"@typescript-eslint/visitor-keys": "8.37.0",
"graphemer": "^1.4.0",
"ignore": "^7.0.0",
"natural-compare": "^1.4.0",
@ -2280,7 +2280,7 @@
"url": "https://opencollective.com/typescript-eslint"
},
"peerDependencies": {
"@typescript-eslint/parser": "^8.36.0",
"@typescript-eslint/parser": "^8.37.0",
"eslint": "^8.57.0 || ^9.0.0",
"typescript": ">=4.8.4 <5.9.0"
}
@ -2296,16 +2296,16 @@
}
},
"node_modules/@typescript-eslint/parser": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.36.0.tgz",
"integrity": "sha512-FuYgkHwZLuPbZjQHzJXrtXreJdFMKl16BFYyRrLxDhWr6Qr7Kbcu2s1Yhu8tsiMXw1S0W1pjfFfYEt+R604s+Q==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.37.0.tgz",
"integrity": "sha512-kVIaQE9vrN9RLCQMQ3iyRlVJpTiDUY6woHGb30JDkfJErqrQEmtdWH3gV0PBAfGZgQXoqzXOO0T3K6ioApbbAA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/scope-manager": "8.36.0",
"@typescript-eslint/types": "8.36.0",
"@typescript-eslint/typescript-estree": "8.36.0",
"@typescript-eslint/visitor-keys": "8.36.0",
"@typescript-eslint/scope-manager": "8.37.0",
"@typescript-eslint/types": "8.37.0",
"@typescript-eslint/typescript-estree": "8.37.0",
"@typescript-eslint/visitor-keys": "8.37.0",
"debug": "^4.3.4"
},
"engines": {
@ -2321,14 +2321,14 @@
}
},
"node_modules/@typescript-eslint/project-service": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.36.0.tgz",
"integrity": "sha512-JAhQFIABkWccQYeLMrHadu/fhpzmSQ1F1KXkpzqiVxA/iYI6UnRt2trqXHt1sYEcw1mxLnB9rKMsOxXPxowN/g==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.37.0.tgz",
"integrity": "sha512-BIUXYsbkl5A1aJDdYJCBAo8rCEbAvdquQ8AnLb6z5Lp1u3x5PNgSSx9A/zqYc++Xnr/0DVpls8iQ2cJs/izTXA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/tsconfig-utils": "^8.36.0",
"@typescript-eslint/types": "^8.36.0",
"@typescript-eslint/tsconfig-utils": "^8.37.0",
"@typescript-eslint/types": "^8.37.0",
"debug": "^4.3.4"
},
"engines": {
@ -2343,14 +2343,14 @@
}
},
"node_modules/@typescript-eslint/scope-manager": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.36.0.tgz",
"integrity": "sha512-wCnapIKnDkN62fYtTGv2+RY8FlnBYA3tNm0fm91kc2BjPhV2vIjwwozJ7LToaLAyb1ca8BxrS7vT+Pvvf7RvqA==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.37.0.tgz",
"integrity": "sha512-0vGq0yiU1gbjKob2q691ybTg9JX6ShiVXAAfm2jGf3q0hdP6/BruaFjL/ManAR/lj05AvYCH+5bbVo0VtzmjOA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/types": "8.36.0",
"@typescript-eslint/visitor-keys": "8.36.0"
"@typescript-eslint/types": "8.37.0",
"@typescript-eslint/visitor-keys": "8.37.0"
},
"engines": {
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@ -2361,9 +2361,9 @@
}
},
"node_modules/@typescript-eslint/tsconfig-utils": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.36.0.tgz",
"integrity": "sha512-Nhh3TIEgN18mNbdXpd5Q8mSCBnrZQeY9V7Ca3dqYvNDStNIGRmJA6dmrIPMJ0kow3C7gcQbpsG2rPzy1Ks/AnA==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.37.0.tgz",
"integrity": "sha512-1/YHvAVTimMM9mmlPvTec9NP4bobA1RkDbMydxG8omqwJJLEW/Iy2C4adsAESIXU3WGLXFHSZUU+C9EoFWl4Zg==",
"dev": true,
"license": "MIT",
"engines": {
@ -2378,14 +2378,15 @@
}
},
"node_modules/@typescript-eslint/type-utils": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.36.0.tgz",
"integrity": "sha512-5aaGYG8cVDd6cxfk/ynpYzxBRZJk7w/ymto6uiyUFtdCozQIsQWh7M28/6r57Fwkbweng8qAzoMCPwSJfWlmsg==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.37.0.tgz",
"integrity": "sha512-SPkXWIkVZxhgwSwVq9rqj/4VFo7MnWwVaRNznfQDc/xPYHjXnPfLWn+4L6FF1cAz6e7dsqBeMawgl7QjUMj4Ow==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/typescript-estree": "8.36.0",
"@typescript-eslint/utils": "8.36.0",
"@typescript-eslint/types": "8.37.0",
"@typescript-eslint/typescript-estree": "8.37.0",
"@typescript-eslint/utils": "8.37.0",
"debug": "^4.3.4",
"ts-api-utils": "^2.1.0"
},
@ -2402,9 +2403,9 @@
}
},
"node_modules/@typescript-eslint/types": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.36.0.tgz",
"integrity": "sha512-xGms6l5cTJKQPZOKM75Dl9yBfNdGeLRsIyufewnxT4vZTrjC0ImQT4fj8QmtJK84F58uSh5HVBSANwcfiXxABQ==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.37.0.tgz",
"integrity": "sha512-ax0nv7PUF9NOVPs+lmQ7yIE7IQmAf8LGcXbMvHX5Gm+YJUYNAl340XkGnrimxZ0elXyoQJuN5sbg6C4evKA4SQ==",
"dev": true,
"license": "MIT",
"engines": {
@ -2416,16 +2417,16 @@
}
},
"node_modules/@typescript-eslint/typescript-estree": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.36.0.tgz",
"integrity": "sha512-JaS8bDVrfVJX4av0jLpe4ye0BpAaUW7+tnS4Y4ETa3q7NoZgzYbN9zDQTJ8kPb5fQ4n0hliAt9tA4Pfs2zA2Hg==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.37.0.tgz",
"integrity": "sha512-zuWDMDuzMRbQOM+bHyU4/slw27bAUEcKSKKs3hcv2aNnc/tvE/h7w60dwVw8vnal2Pub6RT1T7BI8tFZ1fE+yg==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/project-service": "8.36.0",
"@typescript-eslint/tsconfig-utils": "8.36.0",
"@typescript-eslint/types": "8.36.0",
"@typescript-eslint/visitor-keys": "8.36.0",
"@typescript-eslint/project-service": "8.37.0",
"@typescript-eslint/tsconfig-utils": "8.37.0",
"@typescript-eslint/types": "8.37.0",
"@typescript-eslint/visitor-keys": "8.37.0",
"debug": "^4.3.4",
"fast-glob": "^3.3.2",
"is-glob": "^4.0.3",
@ -2501,16 +2502,16 @@
}
},
"node_modules/@typescript-eslint/utils": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.36.0.tgz",
"integrity": "sha512-VOqmHu42aEMT+P2qYjylw6zP/3E/HvptRwdn/PZxyV27KhZg2IOszXod4NcXisWzPAGSS4trE/g4moNj6XmH2g==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.37.0.tgz",
"integrity": "sha512-TSFvkIW6gGjN2p6zbXo20FzCABbyUAuq6tBvNRGsKdsSQ6a7rnV6ADfZ7f4iI3lIiXc4F4WWvtUfDw9CJ9pO5A==",
"dev": true,
"license": "MIT",
"dependencies": {
"@eslint-community/eslint-utils": "^4.7.0",
"@typescript-eslint/scope-manager": "8.36.0",
"@typescript-eslint/types": "8.36.0",
"@typescript-eslint/typescript-estree": "8.36.0"
"@typescript-eslint/scope-manager": "8.37.0",
"@typescript-eslint/types": "8.37.0",
"@typescript-eslint/typescript-estree": "8.37.0"
},
"engines": {
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@ -2525,13 +2526,13 @@
}
},
"node_modules/@typescript-eslint/visitor-keys": {
"version": "8.36.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.36.0.tgz",
"integrity": "sha512-vZrhV2lRPWDuGoxcmrzRZyxAggPL+qp3WzUrlZD+slFueDiYHxeBa34dUXPuC0RmGKzl4lS5kFJYvKCq9cnNDA==",
"version": "8.37.0",
"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.37.0.tgz",
"integrity": "sha512-YzfhzcTnZVPiLfP/oeKtDp2evwvHLMe0LOy7oe+hb9KKIumLNohYS9Hgp1ifwpu42YWxhZE8yieggz6JpqO/1w==",
"dev": true,
"license": "MIT",
"dependencies": {
"@typescript-eslint/types": "8.36.0",
"@typescript-eslint/types": "8.37.0",
"eslint-visitor-keys": "^4.2.1"
},
"engines": {
@ -3515,9 +3516,9 @@
}
},
"node_modules/drizzle-orm": {
"version": "0.44.2",
"resolved": "https://registry.npmjs.org/drizzle-orm/-/drizzle-orm-0.44.2.tgz",
"integrity": "sha512-zGAqBzWWkVSFjZpwPOrmCrgO++1kZ5H/rZ4qTGeGOe18iXGVJWf3WPfHOVwFIbmi8kHjfJstC6rJomzGx8g/dQ==",
"version": "0.44.3",
"resolved": "https://registry.npmjs.org/drizzle-orm/-/drizzle-orm-0.44.3.tgz",
"integrity": "sha512-8nIiYQxOpgUicEL04YFojJmvC4DNO4KoyXsEIqN44+g6gNBr6hmVpWk3uyAt4CaTiRGDwoU+alfqNNeonLAFOQ==",
"license": "Apache-2.0",
"peerDependencies": {
"@aws-sdk/client-rds-data": ">=3",
@ -5992,9 +5993,9 @@
}
},
"node_modules/node-addon-api": {
"version": "8.4.0",
"resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-8.4.0.tgz",
"integrity": "sha512-D9DI/gXHvVmjHS08SVch0Em8G5S1P+QWtU31appcKT/8wFSPRcdHadIFSAntdMMVM5zz+/DL+bL/gz3UDppqtg==",
"version": "8.5.0",
"resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-8.5.0.tgz",
"integrity": "sha512-/bRZty2mXUIFY/xU5HLvveNHlswNJej+RnxBjOMkidWfwZzgTbPG1E3K5TOxRLOR+5hX7bSofy8yf1hZevMS8A==",
"license": "MIT",
"engines": {
"node": "^18 || ^20 || >= 21"

77
src/app/actions/blocks.ts
View File

@ -1,7 +1,7 @@
"use server";
import { revalidatePath } from "next/cache";
import { eq, asc } from "drizzle-orm";
import { eq } from "drizzle-orm";
import { db } from "@/lib/db";
import { blocksTable, IBlock } from "@/lib/db/schema";
@ -16,12 +16,24 @@ export async function createBlock(formData: FormData) {
revalidatePath("/notes/[id]", "page");
}
async function getBlock(blockId: string): Promise<IBlock | null> {
const blocks = await db
.select()
.from(blocksTable)
.where(eq(blocksTable.id, blockId));
if (blocks.length === 0) {
return null;
} else {
return blocks[0];
}
}
export async function getBlocks(noteId: string): Promise<IBlock[]> {
return db
.select()
.from(blocksTable)
.where(eq(blocksTable.noteId, noteId))
.orderBy(asc(blocksTable.order));
.orderBy(blocksTable.order);
}
export async function deleteBlock(formData: FormData) {
@ -61,17 +73,66 @@ export async function addLine(formData: FormData) {
export async function deleteLine(formData: FormData) {
const blockId = formData.get("blockId") as string;
const blocks = await db
.select()
.from(blocksTable)
.where(eq(blocksTable.id, blockId));
if (blocks.length === 0) {
const block = await getBlock(blockId);
if (!block) {
return;
}
const block = blocks[0];
await db
.update(blocksTable)
.set({ lines: block.lines.slice(0, -1) })
.where(eq(blocksTable.id, blockId));
revalidatePath("/notes/[id]", "page");
}
export async function moveUp(formData: FormData) {
const blockId = formData.get("blockId") as string;
const block = await getBlock(blockId);
if (!block) return;
// Найти блок, который перед текущим
const siblings = await getBlocks(block.noteId);
const currentIndex = siblings.findIndex((b) => b.id === block.id);
if (currentIndex <= 0) return;
const prevBlock = siblings[currentIndex - 1];
if (!prevBlock) return;
await db.transaction(async (tx) => {
await tx
.update(blocksTable)
.set({ order: prevBlock.order })
.where(eq(blocksTable.id, block.id));
await tx
.update(blocksTable)
.set({ order: block.order })
.where(eq(blocksTable.id, prevBlock.id));
});
revalidatePath("/notes/[id]", "page");
}
export async function moveDown(formData: FormData) {
const blockId = formData.get("blockId") as string;
const block = await getBlock(blockId);
if (!block) return;
const siblings = await getBlocks(block.noteId);
const currentIndex = siblings.findIndex((b) => b.id === block.id);
if (currentIndex === -1 || currentIndex >= siblings.length - 1) return;
const nextBlock = siblings[currentIndex + 1];
if (!nextBlock) return;
await db.transaction(async (tx) => {
await tx
.update(blocksTable)
.set({ order: nextBlock.order })
.where(eq(blocksTable.id, block.id));
await tx
.update(blocksTable)
.set({ order: block.order })
.where(eq(blocksTable.id, nextBlock.id));
});
revalidatePath("/notes/[id]", "page");
}

12
src/components/editor/Block.tsx
View File

@ -1,5 +1,5 @@
import { ArrowDown, ArrowUp, LockOpen, Lock, Minus, Plus, X } from "lucide-react";
import { addLine, changeLock, deleteBlock, deleteLine } from "@/app/actions/blocks";
import { addLine, changeLock, deleteBlock, deleteLine, moveDown, moveUp } from "@/app/actions/blocks";
import { IBlock } from "@/lib/db/schema";
import IconOnlyButton from "../ui/IconOnlyButton";
import LineInput from "./LineInput";
@ -30,8 +30,14 @@ export default function Block({ block }: { block: IBlock }) {
</form>
</div>
<div className="flex gap-1">
<IconOnlyButton icon={<ArrowUp size={18} />} />
<IconOnlyButton icon={<ArrowDown size={18} />} />
<form action={moveUp}>
<input type="hidden" name="blockId" value={block.id} />
<IconOnlyButton type="submit" icon={<ArrowUp size={18} />} />
</form>
<form action={moveDown}>
<input type="hidden" name="blockId" value={block.id} />
<IconOnlyButton type="submit" icon={<ArrowDown size={18} />} />
</form>
</div>
<div className="flex gap-2 ml-auto">
<form action={changeLock}>

2
src/lib/db/schema.ts
View File

@ -32,7 +32,7 @@ export const blocksTable = pgTable("blocks", {
tag: varchar({ length: 100 }).notNull().default(""),
lines: json().notNull().default(["", "", "", ""]).$type<string[]>(),
isLocked: boolean().notNull().default(false),
order: integer().notNull().default(1),
order: integer().notNull(),
noteId: uuid().notNull().references(() => notesTable.id, { onDelete: "cascade" }),
});