aboutsummaryrefslogtreecommitdiff
path: root/apps/web/app
diff options
context:
space:
mode:
Diffstat (limited to 'apps/web/app')
-rw-r--r--apps/web/app/(dash)/(memories)/content.tsx10
-rw-r--r--apps/web/app/(dash)/menu.tsx185
-rw-r--r--apps/web/app/editor/page.tsx8
3 files changed, 119 insertions, 84 deletions
diff --git a/apps/web/app/(dash)/(memories)/content.tsx b/apps/web/app/(dash)/(memories)/content.tsx
index 0f83d0fc..9dba3637 100644
--- a/apps/web/app/(dash)/(memories)/content.tsx
+++ b/apps/web/app/(dash)/(memories)/content.tsx
@@ -304,7 +304,13 @@ function SpaceComponent({
href={`/space/${id}`}
className="flex items-center justify-between w-full"
>
- <div className="grow">
+ <div>
+ <div className="h-12 w-12 flex justify-center items-center rounded-md">
+ {title.slice(0, 2).toUpperCase()}
+ {id}
+ </div>
+ </div>
+ <div className="grow px-2">
<div className="text-lg text-[#fff] line-clamp-2">{title}</div>
<div>{description}</div>
</div>
@@ -312,7 +318,7 @@ function SpaceComponent({
<Image src={NextIcon} alt="Search icon" />
</div>
</Link>
- <div className="absolute z-40 right-5 top-4 opacity-0 group-hover:opacity-100 hover:text-red-600">
+ <div className="absolute z-40 right-3 top-3 opacity-0 group-hover:opacity-100 hover:text-red-600">
<SpaceDeleteAlert
onClick={() => {
handleDeleteSpace(id);
diff --git a/apps/web/app/(dash)/menu.tsx b/apps/web/app/(dash)/menu.tsx
index abac5411..45cfc599 100644
--- a/apps/web/app/(dash)/menu.tsx
+++ b/apps/web/app/(dash)/menu.tsx
@@ -11,6 +11,7 @@ import {
} from "@repo/ui/icons";
import { Button } from "@repo/ui/shadcn/button";
import { MinusIcon, PlusCircleIcon } from "lucide-react";
+import Editor from "@/components/editor/advanced-editor";
import {
Dialog,
DialogContent,
@@ -58,20 +59,16 @@ function Menu() {
},
];
-
-
const [dialogOpen, setDialogOpen] = useState(false);
return (
- <>
+ <div>
{/* Desktop Menu */}
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
<div className="hidden lg:flex fixed h-screen w-full p-4 items-center top-0 left-0 pointer-events-none z-[39]">
<div className="pointer-events-auto group flex w-14 text-foreground-menu text-[15px] font-medium flex-col items-start gap-6 overflow-hidden rounded-[28px] border-2 border-border bg-secondary px-3 py-4 duration-200 hover:w-40 z-[99999]">
<div className="border-b border-border pb-4 w-full">
- <DialogTrigger
- className="flex w-full text-white brightness-75 hover:brightness-125 focus:brightness-125 cursor-pointer items-center gap-3 px-1 duration-200 justify-start"
- >
+ <DialogTrigger className="flex w-full text-white brightness-75 hover:brightness-125 focus:brightness-125 cursor-pointer items-center gap-3 px-1 duration-200 justify-start">
<Image
src={AddIcon}
alt="Logo"
@@ -105,7 +102,7 @@ function Menu() {
</div>
</div>
- <DialogContentMenu setDialogClose={()=> setDialogOpen(false)} />
+ <DialogContentMenu setDialogClose={() => setDialogOpen(false)} />
{/* Mobile Menu */}
<div className="lg:hidden fixed bottom-0 left-0 w-full p-4 bg-secondary z-50 border-t-2 border-border">
@@ -154,12 +151,11 @@ function Menu() {
</div>
</div>
</Dialog>
- </>
+ </div>
);
}
-function DialogContentMenu({setDialogClose}: {setDialogClose: ()=> void}){
-
+function DialogContentMenu({ setDialogClose }: { setDialogClose: () => void }) {
const [spaces, setSpaces] = useState<StoredSpace[]>([]);
useEffect(() => {
@@ -221,7 +217,7 @@ function DialogContentMenu({setDialogClose}: {setDialogClose: ()=> void}){
setContent("");
setSelectedSpaces([]);
return cont;
- }
+ };
const formSubmit = () => {
toast.promise(handleSubmit(content, selectedSpaces), {
@@ -236,89 +232,114 @@ function DialogContentMenu({setDialogClose}: {setDialogClose: ()=> void}){
richColors: true,
});
};
+
+ const [editorOpen, setEditorOpen] = useState(false);
return (
<DialogContent className="sm:max-w-[575px] text-[#F2F3F5] rounded-2xl bg-background z-[39]">
- <form action={formSubmit} className="flex flex-col gap-4 ">
- <DialogHeader>
+ <form action={formSubmit} className="flex flex-col gap-4 ">
+ <DialogHeader>
<DialogTitle>Add memory</DialogTitle>
</DialogHeader>
- <div>
- <Label htmlFor="space">Save to Spaces (Optional)</Label>
- <ComboboxWithCreate
- placeholder="spaces to save to..."
- setSelectedSpaces={setSelectedSpaces}
- selectedSpaces={selectedSpaces}
- options={spaces.map((x) => ({
- label: x.name,
- value: x.id.toString(),
- }))}
- onSelect={(v) =>
- setSelectedSpaces((prev) => {
- if (v === "") {
- return [];
- }
- return [...prev, parseInt(v)];
- })
+ <div>
+ <Label htmlFor="space">Save to Spaces (Optional)</Label>
+ <ComboboxWithCreate
+ placeholder="spaces to save to..."
+ setSelectedSpaces={setSelectedSpaces}
+ selectedSpaces={selectedSpaces}
+ options={spaces.map((x) => ({
+ label: x.name,
+ value: x.id.toString(),
+ }))}
+ onSelect={(v) =>
+ setSelectedSpaces((prev) => {
+ if (v === "") {
+ return [];
}
- onSubmit={async (spaceName) => {
- const space = options.find((x) => x.label === spaceName);
- toast.info("Creating space...");
+ return [...prev, parseInt(v)];
+ })
+ }
+ onSubmit={async (spaceName) => {
+ const space = options.find((x) => x.label === spaceName);
+ toast.info("Creating space...");
- if (space) {
- toast.error("A space with that name already exists.");
- }
+ if (space) {
+ toast.error("A space with that name already exists.");
+ }
- const creationTask = await createSpace(spaceName);
- if (creationTask.success && creationTask.data) {
- toast.success("Space created " + creationTask.data);
- setSpaces((prev) => [
- ...prev,
- {
- name: spaceName,
- id: creationTask.data!,
- createdAt: new Date(),
- user: null,
- numItems: 0,
- },
- ]);
- setSelectedSpaces((prev) => [...prev, creationTask.data!]);
- } else {
- toast.error("Space creation failed: " + creationTask.error);
- }
- }}
- />
- </div>
+ const creationTask = await createSpace(spaceName);
+ if (creationTask.success && creationTask.data) {
+ toast.success("Space created " + creationTask.data);
+ setSpaces((prev) => [
+ ...prev,
+ {
+ name: spaceName,
+ id: creationTask.data!,
+ createdAt: new Date(),
+ user: null,
+ numItems: 0,
+ },
+ ]);
+ setSelectedSpaces((prev) => [...prev, creationTask.data!]);
+ } else {
+ toast.error("Space creation failed: " + creationTask.error);
+ }
+ }}
+ />
+ </div>
- <div>
- <Label htmlFor="name">Resource (URL or content)</Label>
- <Textarea
- autoFocus
- className={`bg-[#2F353C] text-[#DBDEE1] max-h-[35vh] overflow-auto focus-visible:ring-0 border-none focus-visible:ring-offset-0 mt-2 ${/^https?:\/\/\S+$/i.test(content) && "text-[#1D9BF0] underline underline-offset-2"}`}
- id="content"
- name="content"
- rows={8}
- placeholder="Start typing a note or paste a URL here. I'll remember it."
- value={content}
- onChange={(e) => setContent(e.target.value)}
- onKeyDown={(e) => {
- if (e.key === "Enter" && !e.shiftKey) {
- e.preventDefault();
- formSubmit();
- }
- }}
- />
- </div>
+ <div>
+ <Label htmlFor="name">Resource (URL or content)</Label>
+ <Textarea
+ autoFocus
+ className={`bg-[#2F353C] text-[#DBDEE1] max-h-[35vh] overflow-auto focus-visible:ring-0 border-none focus-visible:ring-offset-0 mt-2 ${/^https?:\/\/\S+$/i.test(content) && "text-[#1D9BF0] underline underline-offset-2"}`}
+ id="content"
+ name="content"
+ rows={8}
+ placeholder="Start typing a note or paste a URL here. I'll remember it."
+ value={content}
+ onChange={(e) => setContent(e.target.value)}
+ onKeyDown={(e) => {
+ if (e.key === "Enter" && !e.shiftKey) {
+ e.preventDefault();
+ formSubmit();
+ }
+ }}
+ />
+ </div>
- <DialogFooter>
- <SubmitButton autoDetectedType={autoDetectedType} />
- </DialogFooter>
- </form>
- </DialogContent>
- )
+ <DialogFooter>
+ <Dialog onOpenChange={setEditorOpen} open={editorOpen}>
+ <DialogTrigger>
+ <Button variant={"secondary"} type="button">
+ Open Markdown Editor
+ </Button>
+ </DialogTrigger>
+ <EditorDialog
+ setContent={(e) => {
+ console.log(e);
+ console.log("hello there");
+ setContent(e);
+ setEditorOpen(false);
+ }}
+ />
+ </Dialog>
+ <SubmitButton autoDetectedType={autoDetectedType} />
+ </DialogFooter>
+ </form>
+ </DialogContent>
+ );
+}
+
+function EditorDialog({ setContent }: { setContent: (e: string) => void }) {
+ return (
+ <DialogContent className="max-w-[98vw] h-[98vh] overflow-hidden px-0 py-0 z-[100]">
+ <Editor setContent={(e) => setContent(e)} />
+ </DialogContent>
+ );
}
-function SubmitButton({autoDetectedType}: {autoDetectedType: string}) {
+function SubmitButton({ autoDetectedType }: { autoDetectedType: string }) {
const status = useFormStatus();
return (
<Button disabled={status.pending} variant={"secondary"} type="submit">
diff --git a/apps/web/app/editor/page.tsx b/apps/web/app/editor/page.tsx
new file mode 100644
index 00000000..14d70d79
--- /dev/null
+++ b/apps/web/app/editor/page.tsx
@@ -0,0 +1,8 @@
+import React from "react";
+import Editor from "../../components/editor/advanced-editor";
+
+function page() {
+ return <Editor />;
+}
+
+export default page;
generated by cgit v1.2.3 (git 2.25.1) at 2026-03-13 17:40:30 +0000