Skip to content

Commit

Permalink
notess
Browse files Browse the repository at this point in the history
  • Loading branch information
@yxshv
yxshv committed Apr 11, 2024
1 parent 628a017 commit b425476
Show file tree
Hide file tree
Showing 7 changed files with 89 additions and 52 deletions.
3 changes: 2 additions & 1 deletion apps/web/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,9 @@
"react": "^18",
"react-dom": "^18",
"tailwind-merge": "^2.2.1",
"tailwindcss": "^3.4.3",
"tailwindcss-animate": "^1.0.7",
"tiptap-markdown": "^0.8.10",
"vaul": "^0.9.0"
},
"devDependencies": {
Expand All @@ -46,7 +48,6 @@
"eslint-plugin-next-on-pages": "^1.11.0",
"postcss": "^8",
"tailwind-scrollbar": "^3.1.0",
"tailwindcss": "^3.3.0",
"typescript": "^5",
"vercel": "^33.6.2",
"wrangler": "^3.41.0"
Expand Down
6 changes: 5 additions & 1 deletion apps/web/src/app/globals.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ body {
border: 1px solid var(--gray-10) !important;
}

.novel-editor .is-editor-empty::before {
.novel-editor .is-empty::before {
content: 'Press \'/\' for commands' !important;
}

Expand All @@ -119,3 +119,7 @@ body {
.novel-editor h3 {
@apply text-lg;
}

.novel-editor .drag-handle {
@apply hidden;
}
36 changes: 10 additions & 26 deletions apps/web/src/components/Main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ import { ChatHistory } from "../../types/memory";
import { ChatAnswer, ChatMessage, ChatQuestion } from "./ChatMessage";
import { useRouter, useSearchParams } from "next/navigation";
import { useMemory } from "@/contexts/MemoryContext";
import WordMark from "./WordMark";

import Image from "next/image";

function supportsDVH() {
try {
Expand All @@ -21,30 +22,6 @@ function supportsDVH() {
}
}

const failResponse = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. In volutpat bibendum ligula, nec consectetur purus iaculis eu. Sed venenatis magna at lacus efficitur, vel faucibus sem lobortis. Sed sit amet imperdiet eros, nec vestibulum ante. Integer ut eros pulvinar, tempus augue a, blandit nisl. Nulla ut ligula molestie, tincidunt ligula vitae, rhoncus tellus. Vestibulum molestie, orci nec scelerisque finibus, mauris eros convallis urna, vitae vehicula metus nisi id urna. Phasellus non metus et lectus sollicitudin convallis a sit amet turpis. Donec id lacinia sapien.
Donec eget eros diam. Ut enim nunc, placerat vitae augue vel, rutrum dapibus felis. Nulla et ultrices ex. In sed arcu eget lectus scelerisque semper. Nullam aliquam luctus ultrices. Morbi finibus nec dolor vitae mattis. Quisque ligula dui, ullamcorper sed blandit et, maximus vel quam. Nunc id eros id sapien tempor feugiat sit amet sed mi. Quisque feugiat hendrerit libero non cursus. Praesent convallis, diam eget ullamcorper bibendum, est tellus blandit velit, vel cursus diam turpis sed nisi.
Cras dictum tortor ex, id ullamcorper nibh mollis quis. Fusce mollis, massa vel sodales consectetur, lorem mi vehicula erat, id tincidunt lorem libero at augue. Suspendisse vitae enim varius, molestie augue ut, lobortis ipsum. Nam lobortis leo eget velit auctor, ac consequat nisl malesuada. Donec sed dapibus nunc. Curabitur euismod erat a erat viverra vestibulum lacinia quis nisl. Aenean rhoncus suscipit maximus. Aliquam vitae lectus est.
Sed rhoncus sem sapien, at posuere libero imperdiet eget. Maecenas in egestas quam. Duis non faucibus eros, nec sodales sem. Proin felis urna, dapibus eget ante vitae, porttitor bibendum nunc. Integer nec augue eget diam pulvinar vestibulum. Nulla lobortis libero tellus, eu commodo elit ullamcorper in. Sed semper ultricies turpis ac dignissim. Morbi at ligula non urna mollis interdum vitae sed nisi. Quisque mattis arcu eu nisl placerat ullamcorper. Cras aliquet risus sed hendrerit faucibus. Donec vitae ex quis magna cursus ultricies ut nec urna.
Integer molestie nulla interdum enim suscipit malesuada. Nullam eget ipsum et elit sagittis imperdiet sed dignissim sem. Fusce vitae tellus ligula. Donec eget mi varius, consequat eros sed, consectetur urna. Suspendisse potenti. Praesent posuere ullamcorper tincidunt. Donec bibendum, magna nec mollis posuere, nisi risus dictum mauris, sed gravida metus sapien vel ipsum. Etiam ultrices nulla tincidunt erat lacinia, sit amet bibendum libero posuere. Vestibulum vehicula lectus dolor, sit amet vehicula arcu ultricies nec. Proin blandit risus diam, vel finibus erat efficitur in. Suspendisse lacinia eros luctus posuere fermentum. Etiam sed lacus aliquam, vulputate est sed, venenatis ex. Aenean at nulla rhoncus, sollicitudin elit quis, auctor tortor. Donec semper, augue lacinia pharetra imperdiet, metus purus bibendum ex, et venenatis enim purus vitae nulla. Duis eu felis porta ligula laoreet viverra.
Answer
It seems like you've used placeholder text commonly known as "Lorem Ipsum," which is often used in design and publishing to simulate the appearance of written text. If you have any specific questions or need assistance with something related to this text, feel free to ask!
what is its purpose?
Sources
solopress.com favicon
typingpal.com favicon
View 2 more
Answer
The purpose of Lorem Ipsum, a commonly used placeholder text in design and publishing, is to create a natural-looking block of text that doesn't distract from the layout. It allows designers to visualize how text will appear in a design without the need for actual content to be written and approved. Lorem Ipsum helps in planning out where the content will sit on a page, focusing on the design rather than the specific content. This practice is particularly useful when the main emphasis is on the visual layout, allowing designers and clients to review templates without being distracted by the actual copy on the page
4
5
.
hello
`;

export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
const searchParams = useSearchParams();
const router = useRouter();
Expand Down Expand Up @@ -290,10 +267,17 @@ export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
data-sidebar-open={sidebarOpen}
ref={main}
className={cn(
"sidebar flex w-full flex-col items-end justify-center gap-5 px-5 pt-5 transition-[padding-left,padding-top,padding-right] delay-200 duration-200 md:items-center md:gap-10 md:px-72 [&[data-sidebar-open='true']]:pr-10 [&[data-sidebar-open='true']]:delay-0 md:[&[data-sidebar-open='true']]:pl-[calc(2.5rem+30vw)]",
"sidebar relative flex w-full flex-col items-end justify-center gap-5 px-5 pt-5 transition-[padding-left,padding-top,padding-right] delay-200 duration-200 md:items-center md:gap-10 md:px-72 [&[data-sidebar-open='true']]:pr-10 [&[data-sidebar-open='true']]:delay-0 md:[&[data-sidebar-open='true']]:pl-[calc(2.5rem+30vw)]",
hide ? "" : "main-hidden",
)}
>
<Image
className="absolute right-10 top-10 rounded-md"
src="/icons/logo_bw_without_bg.png"
alt="Smort logo"
width={50}
height={50}
/>
<h1 className="text-rgray-11 mt-auto w-full text-center text-3xl font-bold tracking-tight md:mt-0">
Ask your second brain
</h1>
Expand Down
60 changes: 53 additions & 7 deletions apps/web/src/components/Sidebar/AddMemoryDialog.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ import {
} from "../ui/dialog";
import { Input } from "../ui/input";
import { Label } from "../ui/label";
import { useRef } from "react";
import { Markdown } from "tiptap-markdown";
import { useEffect, useRef, useState } from "react";

export function AddMemoryPage() {
return (
Expand Down Expand Up @@ -39,23 +40,68 @@ export function AddMemoryPage() {
);
}

export function NoteAddPage() {
export function NoteAddPage({ closeDialog }: { closeDialog: () => void }) {
const inputRef = useRef<HTMLInputElement>(null);
const [name, setName] = useState("");
const [content, setContent] = useState("");
const [loading, setLoading] = useState(false);

function check() {
const data = {
name: name.trim(),
content,
};
console.log(name);
if (!data.name || data.name.length < 1) {
if (!inputRef.current) {
alert("Please enter a name for the note");
return;
}
inputRef.current.value = "";
inputRef.current.placeholder = "Please enter a title for the note";
inputRef.current.dataset["error"] = "true";
setTimeout(() => {
inputRef.current!.placeholder = "Title of the note";
inputRef.current!.dataset["error"] = "false";
}, 500);
inputRef.current.focus();
}
}

return (
<>
<Input
className="w-full border-none p-0 text-xl ring-0 placeholder:text-white/30 focus-visible:ring-0"
placeholder="Name of the note"
ref={inputRef}
data-error="false"
className="w-full border-none p-0 text-xl ring-0 placeholder:text-white/30 placeholder:transition placeholder:duration-200 focus-visible:ring-0 data-[error=true]:placeholder:text-red-400"
placeholder="Title of the note"
data-modal-autofocus
value={name}
onChange={(e) => setName(e.target.value)}
/>
<Editor
disableLocalStorage
defaultValue={""}
onUpdate={(editor) => {
if (!editor) return;
setContent(editor.storage.markdown.getMarkdown());
}}
extensions={[Markdown]}
className="novel-editor bg-rgray-4 border-rgray-7 dark mt-5 max-h-[60vh] min-h-[40vh] w-[50vw] overflow-y-auto rounded-lg border [&>div>div]:p-5"
/>
<DialogFooter>
<DialogClose className="bg-rgray-4 hover:bg-rgray-5 focus-visible:bg-rgray-5 focus-visible:ring-rgray-7 rounded-md px-4 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
<button
onClick={() => {
check();
}}
className="bg-rgray-4 hover:bg-rgray-5 focus-visible:bg-rgray-5 focus-visible:ring-rgray-7 rounded-md px-4 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2"
>
Add
</DialogClose>
<DialogClose className="hover:bg-rgray-4 focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 rounded-md px-3 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2">
</button>
<DialogClose
type={undefined}
className="hover:bg-rgray-4 focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 rounded-md px-3 py-2 ring-transparent transition focus-visible:outline-none focus-visible:ring-2"
>
Cancel
</DialogClose>
</DialogFooter>
Expand Down
12 changes: 7 additions & 5 deletions apps/web/src/components/Sidebar/MemoriesBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export function MemoriesBar() {
/>
</div>
<div className="mt-2 flex w-full px-8">
<AddMemoryModal isOpen={isDropdownOpen} type={addMemoryState}>
<AddMemoryModal type={addMemoryState}>
<DropdownMenu open={isDropdownOpen} onOpenChange={setIsDropdownOpen}>
<DropdownMenuTrigger asChild>
<button className="focus-visible:bg-rgray-4 focus-visible:ring-rgray-7 hover:bg-rgray-4 ml-auto flex items-center justify-center rounded-md px-3 py-2 transition focus-visible:outline-none focus-visible:ring-2">
Expand Down Expand Up @@ -305,14 +305,14 @@ export function SpaceMoreButton({
export function AddMemoryModal({
type,
children,
isOpen,
}: {
type: "page" | "note" | "space" | null;
children?: React.ReactNode | React.ReactNode[];
isOpen: boolean;
}) {
const [isDialogOpen, setIsDialogOpen] = useState(false);

return (
<Dialog>
<Dialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
{children}
<DialogContent
onOpenAutoFocus={(e) => {
Expand Down Expand Up @@ -340,7 +340,9 @@ export function AddMemoryModal({
className="w-max max-w-[auto]"
>
{type === "page" && <AddMemoryPage />}
{type === "note" && <NoteAddPage />}
{type === "note" && (
<NoteAddPage closeDialog={() => setIsDialogOpen(false)} />
)}
</DialogContent>
</Dialog>
);
Expand Down
12 changes: 0 additions & 12 deletions apps/web/src/components/Sidebar/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,6 @@ import { Bin } from "@/assets/Bin";
import { Avatar, AvatarFallback, AvatarImage } from "@radix-ui/react-avatar";
import { useSession } from "next-auth/react";
import MessagePoster from "@/app/MessagePoster";
import Image from "next/image";
import WordMark from "../WordMark";

export type MenuItem = {
icon: React.ReactNode | React.ReactNode[];
Expand Down Expand Up @@ -77,16 +75,6 @@ export default function Sidebar({
<>
<div className="relative hidden h-screen max-h-screen w-max flex-col items-center text-sm font-light md:flex">
<div className="bg-rgray-3 border-r-rgray-6 relative z-[50] flex h-full w-full flex-col items-center justify-center border-r px-2 py-5 ">
<Image
className="mb-4 rounded-md"
src="/icons/logo_bw_without_bg.png"
alt="Smort logo"
width={50}
height={50}
/>

<div className="bg-rgray-6 mb-8 h-[1px] w-full" />

<MenuItem
item={{
label: "Memories",
Expand Down
12 changes: 12 additions & 0 deletions apps/web/tailwind.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,12 +44,24 @@ const config: Config = {
opacity: "1",
},
},
"input-error": {
"0%": {
color: "var(--gray-11)",
},
"50%": {
color: "red",
},
"100%": {
color: "var(--gray-11)",
},
},
},
animation: {
"scale-in": "scale-in 0.2s cubic-bezier(0.16, 1, 0.3, 1)",
"scale-out": "scale-out 0.2s cubic-bezier(0.16, 1, 0.3, 1)",
"fade-in": "fade-in 0.2s 0.5s forwards cubic-bezier(0.16, 1, 0.3, 1)",
"from-top": "from-top 0.2s ease-in-out",
"input-error": "input-error 5s",
},
backgroundImage: {
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
Expand Down

0 comments on commit b425476

Please sign in to comment.