Merge pull request #116 from wwsalmon/0.25.2

0.25.3 fixes lots of bugs: #108, #109, #110, #112, #113
wwsalmon · Dec 28, 2022 · 9507fe4 · 9507fe4
2 parents 3d4436a + 9f9ece6
commit 9507fe4
Show file tree

Hide file tree

Showing 9 changed files with 86 additions and 41 deletions.
diff --git a/components/navbar/Navbar.tsx b/components/navbar/Navbar.tsx
@@ -1,6 +1,6 @@
 import Link from "next/link";
 import {signOut, useSession} from "next-auth/react";
-import {FiBell, FiChevronDown, FiGrid, FiSearch, FiUser} from "react-icons/fi";
+import {FiBell, FiChevronDown, FiGrid, FiLogOut, FiSearch, FiUser} from "react-icons/fi";
 import {useEffect} from "react";
 import {useRouter} from "next/router";
 import {MoreMenu, MoreMenuItem} from "../headless/MoreMenu";
@@ -12,6 +12,7 @@ import {NotificationApiResponse} from "../../pages/api/notification";
 import getProjectUrl from "../../utils/getProjectUrl";
 import {formatDistanceToNow} from "date-fns";
 import Button from "../headless/Button";
+import classNames from "classnames";
 
 function getNotificationText(notification: DatedObj<NotificationApiResponse>) {
     if (["commentLike", "nodeLike"].includes(notification.type)) {
@@ -40,37 +41,45 @@ function NotificationItem({notification}: {notification: DatedObj<NotificationAp
     );
 }
 
+export function getIsProjectSubpage(route: string) {
+    return route.substring(0, 28) === "/[username]/[projectUrlName]" && !["", "/posts", "/evergreens", "/sources"].includes(route.substring(28));
+}
+
 export default function Navbar() {
     const router = useRouter();
     const {data: session, status} = useSession();
 
-    const isPublicPage = router.route.substring(0, 28) === "/[username]/[projectUrlName]";
+    const isProjectSubpage = getIsProjectSubpage(router.route);
 
     const {data: notificationsData} = useSWR(`/api/notification?authed=${!!session}`, session ? fetcher : () => []);
 
     return (
         <div className="w-full bg-white sticky mb-8 top-0 z-30">
             <div className="mx-auto h-12 sm:h-16 flex items-center px-4">
-                <Link href={session ? "/repositories" : "/"}><a><img src="/logo.svg" className={`${isPublicPage ? "hidden sm:block" : ""} h-8 mr-10`}/></a></Link>
-                <Link href={session ? "/repositories" : "/"}><a><img src="/postulate-tile.svg" className={`h-6 ${isPublicPage ? "sm:hidden" : "hidden"} mr-10`}/></a></Link>
-                {session && (
-                    <Link href={"/repositories"}>
-                        <a className={`hidden ${isPublicPage ? "lg" : "md"}:flex items-center opacity-50 hover:opacity-100 mr-10`}>
-                            <div className="mr-3">
-                                <FiGrid/>
-                            </div>
-                            Projects
-                        </a>
-                    </Link>
+                <Link href={session ? "/repositories" : "/"}><a><img src="/logo.svg" className={`${isProjectSubpage ? "hidden" : ""} h-8 mr-10`}/></a></Link>
+                <Link href={session ? "/repositories" : "/"}><a><img src="/postulate-tile.svg" className={`h-6 ${isProjectSubpage ? "" : "hidden"} mr-10`}/></a></Link>
+                {!isProjectSubpage && (
+                    <>
+                        {session && (
+                            <Link href={"/repositories"}>
+                                <a className={`hidden ${isProjectSubpage ? "lg" : "md"}:flex items-center opacity-50 hover:opacity-100 mr-10`}>
+                                    <div className="mr-3">
+                                        <FiGrid/>
+                                    </div>
+                                    Projects
+                                </a>
+                            </Link>
+                        )}
+                        <Link href="/explore">
+                            <a className={`hidden ${isProjectSubpage ? "lg" : "md"}:flex items-center opacity-50 hover:opacity-100 mr-10`}>
+                                <div className="mr-3">
+                                    <FiSearch/>
+                                </div>
+                                Explore
+                            </a>
+                        </Link>
+                    </>
                 )}
-                <Link href="/explore">
-                    <a className={`hidden ${isPublicPage ? "lg" : "md"}:flex items-center opacity-50 hover:opacity-100 mr-10`}>
-                        <div className="mr-3">
-                            <FiSearch/>
-                        </div>
-                        Explore
-                    </a>
-                </Link>
                 <div className="ml-auto flex items-center h-full">
                     {session && notificationsData && (
                         <MoreMenu button={(
@@ -99,8 +108,10 @@ export default function Navbar() {
                                 <img src={session ? session.user.image : ""} className="w-6 sm:w-8 rounded-full ml-2"/>
                             </button>
                         )}>
-                            <MoreMenuItem href="/profile">Profile</MoreMenuItem>
-                            <MoreMenuItem onClick={() => signOut()}>Sign out</MoreMenuItem>
+                            <MoreMenuItem href="/repositories" flex={true}><span className="mr-2"><FiGrid/></span>Projects</MoreMenuItem>
+                            <MoreMenuItem href="/explore" flex={true}><span className="mr-2"><FiSearch/></span>Explore</MoreMenuItem>
+                            <MoreMenuItem href="/profile" flex={true}><span className="mr-2"><FiUser/></span>Profile</MoreMenuItem>
+                            <MoreMenuItem onClick={() => signOut()} flex={true}><span className="mr-2"><FiLogOut/></span>Sign out</MoreMenuItem>
                         </MoreMenu>
                     ) : status === "loading" ? (
                         <p>Loading...</p>

diff --git a/components/project/MainShell.tsx b/components/project/MainShell.tsx
@@ -27,6 +27,8 @@ import ExploreNodeCard from "../explore/ExploreNodeCard";
 import H3 from "../style/H3";
 import PublicNavbar from "./PublicNavbar";
 import TabButton from "../style/TabButton";
+import classNames from "classnames";
+import {getIsProjectSubpage} from "../navbar/Navbar";
 
 export type NodeWithShortcut = NodeObj & {shortcut?: DatedObj<ShortcutObj>, project?: DatedObj<ProjectObj>};
 
@@ -239,7 +241,9 @@ export default function MainShell({pageProject, pageUser, thisUser, children}: P
 
     return (
         <Container>
-            <PublicNavbar pageUser={pageUser} pageProject={pageProject}/>
+            {getIsProjectSubpage(router.route) && (
+                <PublicNavbar pageUser={pageUser} pageProject={pageProject}/>
+            )}
             <SEO title={pageProject.name}/>
             <div className="items-center mb-8 flex">
                 <UserButton user={pageUser}/>
@@ -269,9 +273,7 @@ export default function MainShell({pageProject, pageUser, thisUser, children}: P
                         </>
                     )}
                 </div>
-                {pageProject.description && (
-                    <H2 className="mt-2">{pageProject.description}</H2>
-                )}
+                <H2 className={classNames("mt-2", !pageProject.description && "opacity-50")}>{pageProject.description || "Repo has no description"}</H2>
             </div>
             <div className="my-12 md:flex items-center">
                 <div className="ml-auto flex items-center order-2 w-full md:w-auto mb-6 md:mb-0">

diff --git a/components/project/PublicNavbar.tsx b/components/project/PublicNavbar.tsx
@@ -6,12 +6,12 @@ import {DatedObj, ProjectObj, UserObj} from "../../utils/types";
 export default function PublicNavbar({pageUser, pageProject}: {pageUser: DatedObj<UserObj>, pageProject: DatedObj<ProjectObj>}) {
     return (
         <div
-            className="fixed top-0 left-1/2 -translate-x-1/2 flex items-center z-40 transform h-12 sm:h-16"
-            style={{maxWidth: "calc(100% - 220px)"}}
+            className="fixed top-0 left-16 flex items-center z-40 transform h-12 sm:h-16"
+            style={{maxWidth: "calc(100% - 180px)"}}
         >
             <Button
                 href={getProjectUrl(pageUser, pageProject)}
-                className="font-manrope font-bold text-lg w-full"
+                className="font-manrope font-bold text-lg max-w-full"
                 childClassName="truncate"
             >
                 {pageProject.name}

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "updately-pro",
-  "version": "0.25.2",
+  "version": "0.25.3",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -17,6 +17,7 @@
     "@types/react": "^17.0.0",
     "autoprefixer": "^10.2.3",
     "axios": "^0.21.1",
+    "classnames": "^2.3.2",
     "crypto-js": "^4.0.0",
     "date-fns": "^2.16.1",
     "dotenv": "^8.2.0",

diff --git a/pages/api/comment.ts b/pages/api/comment.ts
@@ -68,7 +68,7 @@ const handler: NextApiHandler = nextApiEndpoint({
 
         if (thisParentComment) {
             const subCommentIds = thisParentComment.subComments.map(d => d.userId);
-            const filteredUserIds = [thisParentComment.userId, ...subCommentIds].filter(d => d.toString() !== thisUser.toString());
+            const filteredUserIds = [thisParentComment.userId, ...subCommentIds].filter(d => d.toString() !== thisUser._id.toString());
             allUserIds = Array.from(new Set(filteredUserIds));
 
             const notifications = allUserIds.map(d => ({
@@ -91,7 +91,7 @@ const handler: NextApiHandler = nextApiEndpoint({
                 itemId: thisComment._id,
                 read: false,
                 type: "nodeComment",
-            })
+            });
         }
 
         return res200(res);

diff --git a/pages/api/project.ts b/pages/api/project.ts
@@ -41,7 +41,7 @@ const handler: NextApiHandler = nextApiEndpoint({
     postFunction: async function postFunction(req, res, session, thisUser) {
         const {name, description, urlName, id} = req.body;
 
-        if (!(name && description && urlName)) return res400(res);
+        if (!(name && urlName)) return res400(res);
 
         let existingProjectQuery = {userId: thisUser._id, urlName: urlName};
 
@@ -56,7 +56,7 @@ const handler: NextApiHandler = nextApiEndpoint({
         }, {returnOriginal: false})) : (await ProjectModel.create({
             userId: thisUser._id,
             name: name,
-            description: description,
+            description: description || "",
             urlName: urlName,
         }));
 

diff --git a/slate/SlateEditor.tsx b/slate/SlateEditor.tsx
@@ -1,7 +1,7 @@
 import {Editable, ReactEditor, Slate, withReact} from "slate-react";
-import {createEditor, Node, Text, Element as SlateElement} from "slate";
+import {createEditor, Node, Text, Element as SlateElement, Transforms, Editor} from "slate";
 import {withHistory} from "slate-history";
-import {Dispatch, SetStateAction, useCallback, useMemo} from "react";
+import {Dispatch, SetStateAction, useCallback, useEffect, useMemo} from "react";
 import withLinks, {SlateLinkBalloon} from "./withLinks";
 import {withShortcuts} from "./shortcuts";
 import {onHotkey} from "./hotkeys";
@@ -73,6 +73,26 @@ export function SlateReadOnly({value, fontSize, className}: {value: Node[], font
     const renderElement = useCallback(props => <Element {...props} />, []);
     const renderLeaf = useCallback(props => <Leaf {...props} />, []);
 
+    useEffect(() => {
+        Transforms.delete(editor, {
+            at: {
+                anchor: Editor.start(editor, []),
+                focus: Editor.end(editor, []),
+            },
+        });
+
+        // Removes empty node
+        Transforms.removeNodes(editor, {
+            at: [0],
+        });
+
+        // Insert array of children nodes
+        Transforms.insertNodes(
+            editor,
+            value
+        );
+    }, [value]);
+
     return (
         <div className={`prose ${className || ""}`} style={{fontSize: fontSize || 20}}>
             {/* @ts-ignore */}

diff --git a/slate/onEnter.ts b/slate/onEnter.ts
@@ -18,9 +18,9 @@ export const onEnter = (e: KeyboardEvent<HTMLDivElement>, editor: ReactEditor &
         if (Text.isText(selectedLeaf) && [selectedLeaf.text.length, 0].includes(editor.selection.anchor.offset)) {
             insertEmptyLine(editor);
 
-            if (editor.selection.anchor.offset === 0) {
+            if ([0, editor.children.length - 2].includes(editor.selection.anchor.path[0])) {
                 Transforms.select(editor, {
-                    path: [editor.selection.anchor.path[0] + 1, editor.selection.anchor.path[1]],
+                    path: [editor.selection.anchor.path[0] + 1, 0],
                     offset: 0,
                 });
             }