feat: personal memos page

server/basic_auth.go

@@ -59,6 +59,10 @@ func BasicAuthMiddleware(s *Server, next echo.HandlerFunc) echo.HandlerFunc {
 			return next(c)
 		}
 
+		if common.HasPrefixes(c.Path(), "/api/memo", "/api/tag", "/api/shortcut", "/api/user/:id/name") && c.Request().Method == http.MethodGet {
+			return next(c)
+		}
+
 		// If there is openId in query string and related user is found, then skip auth.
 		openID := c.QueryParam("openId")
 		if openID != "" {

server/memo.go

@@ -60,7 +60,29 @@ func (s *Server) registerMemoRoutes(g *echo.Group) {
 	})
 
 	g.GET("/memo", func(c echo.Context) error {
-		userID := c.Get(getUserIDContextKey()).(int)
+		userID, ok := c.Get(getUserIDContextKey()).(int)
+		if !ok {
+			if c.QueryParam("userID") != "" {
+				var err error
+				userID, err = strconv.Atoi(c.QueryParam("userID"))
+				if err != nil {
+					return echo.NewHTTPError(http.StatusBadRequest, fmt.Sprintf("ID is not a number: %s", c.QueryParam("userID")))
+				}
+			} else {
+				ownerUserType := api.Owner
+				ownerUser, err := s.Store.FindUser(&api.UserFind{
+					Role: &ownerUserType,
+				})
+				if err != nil {
+					return echo.NewHTTPError(http.StatusInternalServerError, "Failed to find owner user").SetInternal(err)
+				}
+				if ownerUser == nil {
+					return echo.NewHTTPError(http.StatusNotFound, "Owner user do not exist")
+				}
+				userID = ownerUser.ID
+			}
+		}
+
 		memoFind := &api.MemoFind{
 			CreatorID: &userID,
 		}

server/shortcut.go

@@ -59,7 +59,29 @@ func (s *Server) registerShortcutRoutes(g *echo.Group) {
 	})
 
 	g.GET("/shortcut", func(c echo.Context) error {
-		userID := c.Get(getUserIDContextKey()).(int)
+		userID, ok := c.Get(getUserIDContextKey()).(int)
+		if !ok {
+			if c.QueryParam("userID") != "" {
+				var err error
+				userID, err = strconv.Atoi(c.QueryParam("userID"))
+				if err != nil {
+					return echo.NewHTTPError(http.StatusBadRequest, fmt.Sprintf("ID is not a number: %s", c.QueryParam("userID")))
+				}
+			} else {
+				ownerUserType := api.Owner
+				ownerUser, err := s.Store.FindUser(&api.UserFind{
+					Role: &ownerUserType,
+				})
+				if err != nil {
+					return echo.NewHTTPError(http.StatusInternalServerError, "Failed to find owner user").SetInternal(err)
+				}
+				if ownerUser == nil {
+					return echo.NewHTTPError(http.StatusNotFound, "Owner user do not exist")
+				}
+				userID = ownerUser.ID
+			}
+		}
+
 		shortcutFind := &api.ShortcutFind{
 			CreatorID: &userID,
 		}

server/tag.go

@@ -2,9 +2,11 @@ package server
 
 import (
 	"encoding/json"
+	"fmt"
 	"net/http"
 	"regexp"
 	"sort"
+	"strconv"
 
 	"github.com/usememos/memos/api"
 
@@ -13,7 +15,29 @@ import (
 
 func (s *Server) registerTagRoutes(g *echo.Group) {
 	g.GET("/tag", func(c echo.Context) error {
-		userID := c.Get(getUserIDContextKey()).(int)
+		userID, ok := c.Get(getUserIDContextKey()).(int)
+		if !ok {
+			if c.QueryParam("userID") != "" {
+				var err error
+				userID, err = strconv.Atoi(c.QueryParam("userID"))
+				if err != nil {
+					return echo.NewHTTPError(http.StatusBadRequest, fmt.Sprintf("ID is not a number: %s", c.QueryParam("userID")))
+				}
+			} else {
+				ownerUserType := api.Owner
+				ownerUser, err := s.Store.FindUser(&api.UserFind{
+					Role: &ownerUserType,
+				})
+				if err != nil {
+					return echo.NewHTTPError(http.StatusInternalServerError, "Failed to find owner user").SetInternal(err)
+				}
+				if ownerUser == nil {
+					return echo.NewHTTPError(http.StatusNotFound, "Owner user do not exist")
+				}
+				userID = ownerUser.ID
+			}
+		}
+
 		contentSearch := "#"
 		normalRowStatus := api.Normal
 		memoFind := api.MemoFind{

server/user.go

@@ -51,6 +51,29 @@ func (s *Server) registerUserRoutes(g *echo.Group) {
 		return nil
 	})
 
+	g.GET("/user/:id/name", func(c echo.Context) error {
+		id, err := strconv.Atoi(c.Param("id"))
+		if err != nil {
+			return echo.NewHTTPError(http.StatusBadRequest, "Malformatted user id").SetInternal(err)
+		}
+
+		user, err := s.Store.FindUser(&api.UserFind{
+			ID: &id,
+		})
+		if err != nil {
+			return echo.NewHTTPError(http.StatusInternalServerError, "Failed to fetch user").SetInternal(err)
+		}
+		if user == nil {
+			return echo.NewHTTPError(http.StatusNotFound, "User not found")
+		}
+
+		c.Response().Header().Set(echo.HeaderContentType, echo.MIMEApplicationJSONCharsetUTF8)
+		if err := json.NewEncoder(c.Response().Writer).Encode(composeResponse(user.Name)); err != nil {
+			return echo.NewHTTPError(http.StatusInternalServerError, "Failed to encode user response").SetInternal(err)
+		}
+		return nil
+	})
+
 	// GET /api/user/me is used to check if the user is logged in.
 	g.GET("/user/me", func(c echo.Context) error {
 		userSessionID := c.Get(getUserIDContextKey())

store/db/seed/10001__user.sql

@@ -17,3 +17,23 @@ VALUES
     -- raw password: secret
     '$2a$14$ajq8Q7fbtFRQvXpdCq7Jcuy.Rx1h/L4J60Otx.gyNLbAYctGMJ9tK'
   );
+
+INSERT INTO 
+  user (
+    `id`, 
+    `email`,
+    `role`,
+    `name`, 
+    `open_id`,
+    `password_hash`
+  )
+VALUES
+  (
+    102, 
+    'jack@usememos.com',
+    'USER',
+    'Jack',
+    'jack_open_id',
+    -- raw password: secret
+    '$2a$14$ajq8Q7fbtFRQvXpdCq7Jcuy.Rx1h/L4J60Otx.gyNLbAYctGMJ9tK'
+  );

store/db/seed/10002__memo.sql

@@ -42,3 +42,16 @@ VALUES
     '好好学习，天天向上。🤜🤛', 
     101
   );
+
+INSERT INTO 
+  memo (
+    `id`,
+    `content`, 
+    `creator_id`
+  )
+VALUES
+  (
+    104,
+    '好好学习，天天向上。🤜🤛', 
+    102
+  );

web/.eslintrc.json

@@ -23,6 +23,12 @@
     ],
     "@typescript-eslint/no-empty-interface": ["off"],
     "@typescript-eslint/no-explicit-any": ["off"],
-    "react/react-in-jsx-scope": "off"
+    "react/react-in-jsx-scope": "off",
+    "sort-imports": [
+      "error",
+      {
+        "memberSyntaxSortOrder": ["all", "multiple", "single", "none"]
+      }
+    ]
   }
 }

web/src/components/Memo.tsx

@@ -3,7 +3,7 @@ import { escape, indexOf } from "lodash-es";
 import { IMAGE_URL_REG, LINK_REG, MEMO_LINK_REG, TAG_REG, UNKNOWN_ID } from "../helpers/consts";
 import { DONE_BLOCK_REG, parseMarkedToHtml, TODO_BLOCK_REG } from "../helpers/marked";
 import * as utils from "../helpers/utils";
-import { editorStateService, locationService, memoService } from "../services";
+import { editorStateService, locationService, memoService, userService } from "../services";
 import Only from "./common/OnlyWhen";
 import Image from "./Image";
 import showMemoCardDialog from "./MemoCardDialog";
@@ -112,7 +112,7 @@ const Memo: React.FC<Props> = (props: Props) => {
       } else {
         locationService.setTagQuery(tagName);
       }
-    } else if (targetEl.classList.contains("todo-block")) {
+    } else if (targetEl.classList.contains("todo-block") && userService.isNotVisitor()) {
       const status = targetEl.dataset?.value;
       const todoElementList = [...(memoContainerRef.current?.querySelectorAll(`span.todo-block[data-value=${status}]`) ?? [])];
       for (const element of todoElementList) {
@@ -158,38 +158,40 @@ const Memo: React.FC<Props> = (props: Props) => {
             <span className="ml-2">PINNED</span>
           </Only>
         </span>
-        <div className="btns-container">
-          <span className="btn more-action-btn">
-            <img className="icon-img" src="/icons/more.svg" />
-          </span>
-          <div className="more-action-btns-wrapper">
-            <div className="more-action-btns-container">
-              <div className="btns-container">
-                <div className="btn" onClick={handleTogglePinMemoBtnClick}>
-                  <img className="icon-img" src="/icons/pin.svg" alt="" />
-                  <span className="tip-text">{memo.pinned ? "Unpin" : "Pin"}</span>
-                </div>
-                <div className="btn" onClick={handleEditMemoClick}>
-                  <img className="icon-img" src="/icons/edit.svg" alt="" />
-                  <span className="tip-text">Edit</span>
-                </div>
-                <div className="btn" onClick={handleGenMemoImageBtnClick}>
-                  <img className="icon-img" src="/icons/share.svg" alt="" />
-                  <span className="tip-text">Share</span>
+        {userService.isNotVisitor() && (
+          <div className="btns-container">
+            <span className="btn more-action-btn">
+              <img className="icon-img" src="/icons/more.svg" />
+            </span>
+            <div className="more-action-btns-wrapper">
+              <div className="more-action-btns-container">
+                <div className="btns-container">
+                  <div className="btn" onClick={handleTogglePinMemoBtnClick}>
+                    <img className="icon-img" src="/icons/pin.svg" alt="" />
+                    <span className="tip-text">{memo.pinned ? "Unpin" : "Pin"}</span>
+                  </div>
+                  <div className="btn" onClick={handleEditMemoClick}>
+                    <img className="icon-img" src="/icons/edit.svg" alt="" />
+                    <span className="tip-text">Edit</span>
+                  </div>
+                  <div className="btn" onClick={handleGenMemoImageBtnClick}>
+                    <img className="icon-img" src="/icons/share.svg" alt="" />
+                    <span className="tip-text">Share</span>
+                  </div>
                 </div>
+                <span className="btn" onClick={handleMarkMemoClick}>
+                  Mark
+                </span>
+                <span className="btn" onClick={handleShowMemoStoryDialog}>
+                  View Story
+                </span>
+                <span className="btn archive-btn" onClick={handleArchiveMemoClick}>
+                  Archive
+                </span>
               </div>
-              <span className="btn" onClick={handleMarkMemoClick}>
-                Mark
-              </span>
-              <span className="btn" onClick={handleShowMemoStoryDialog}>
-                View Story
-              </span>
-              <span className="btn archive-btn" onClick={handleArchiveMemoClick}>
-                Archive
-              </span>
             </div>
           </div>
-        </div>
+        )}
       </div>
       <div
         ref={memoContainerRef}

web/src/components/MenuBtnsPopup.tsx

@@ -55,6 +55,10 @@ const MenuBtnsPopup: React.FC<Props> = (props: Props) => {
     window.location.reload();
   };
 
+  const handleSignInBtnClick = async () => {
+    locationService.replaceHistory("/signin");
+  };
+
   return (
     <div className={`menu-btns-popup ${shownStatus ? "" : "hidden"}`} ref={popupElRef}>
       <button className="btn action-btn" onClick={handleAboutBtnClick}>
@@ -63,8 +67,8 @@ const MenuBtnsPopup: React.FC<Props> = (props: Props) => {
       <button className="btn action-btn" onClick={handlePingBtnClick}>
         <span className="icon">🎯</span> Ping
       </button>
-      <button className="btn action-btn" onClick={handleSignOutBtnClick}>
-        <span className="icon">👋</span> Sign out
+      <button className="btn action-btn" onClick={userService.isNotVisitor() ? handleSignOutBtnClick : handleSignInBtnClick}>
+        <span className="icon">👋</span> {userService.isNotVisitor() ? "Sign out" : "Sign in"}
       </button>
     </div>
   );

web/src/components/ShortcutList.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from "react";
-import { locationService, shortcutService } from "../services";
+import { locationService, shortcutService, userService } from "../services";
 import { useAppSelector } from "../store";
 import * as utils from "../helpers/utils";
 import useToggle from "../hooks/useToggle";
@@ -38,9 +38,11 @@ const ShortcutList: React.FC<Props> = () => {
     <div className="shortcuts-wrapper">
       <p className="title-text">
         <span className="normal-text">Shortcuts</span>
-        <span className="btn" onClick={() => showCreateShortcutDialog()}>
-          <img src="/icons/add.svg" alt="add shortcut" />
-        </span>
+        {userService.isNotVisitor() && (
+          <span className="btn" onClick={() => showCreateShortcutDialog()}>
+            <img src="/icons/add.svg" alt="add shortcut" />
+          </span>
+        )}
       </p>
       <div className="shortcuts-container">
         {sortedShortcuts.map((s) => {
@@ -114,28 +116,30 @@ const ShortcutContainer: React.FC<ShortcutContainerProps> = (props: ShortcutCont
         <div className="shortcut-text-container">
           <span className="shortcut-text">{shortcut.title}</span>
         </div>
-        <div className="btns-container">
-          <span className="action-btn toggle-btn">
-            <img className="icon-img" src="/icons/more.svg" />
-          </span>
-          <div className="action-btns-wrapper">
-            <div className="action-btns-container">
-              <span className="btn" onClick={handlePinShortcutBtnClick}>
-                {shortcut.rowStatus === "ARCHIVED" ? "Unpin" : "Pin"}
-              </span>
-              <span className="btn" onClick={handleEditShortcutBtnClick}>
-                Edit
-              </span>
-              <span
-                className={`btn delete-btn ${showConfirmDeleteBtn ? "final-confirm" : ""}`}
-                onClick={handleDeleteMemoClick}
-                onMouseLeave={handleDeleteBtnMouseLeave}
-              >
-                {showConfirmDeleteBtn ? "Delete!" : "Delete"}
-              </span>
+        {userService.isNotVisitor() && (
+          <div className="btns-container">
+            <span className="action-btn toggle-btn">
+              <img className="icon-img" src="/icons/more.svg" />
+            </span>
+            <div className="action-btns-wrapper">
+              <div className="action-btns-container">
+                <span className="btn" onClick={handlePinShortcutBtnClick}>
+                  {shortcut.rowStatus === "ARCHIVED" ? "Unpin" : "Pin"}
+                </span>
+                <span className="btn" onClick={handleEditShortcutBtnClick}>
+                  Edit
+                </span>
+                <span
+                  className={`btn delete-btn ${showConfirmDeleteBtn ? "final-confirm" : ""}`}
+                  onClick={handleDeleteMemoClick}
+                  onMouseLeave={handleDeleteBtnMouseLeave}
+                >
+                  {showConfirmDeleteBtn ? "Delete!" : "Delete"}
+                </span>
+              </div>
             </div>
           </div>
-        </div>
+        )}
       </div>
     </>
   );