chore: tweak view checks

web/src/components/MemoReactionListView.tsx

@@ -1,5 +1,6 @@
 import { uniq } from "lodash-es";
 import { memo, useEffect, useState } from "react";
+import useCurrentUser from "@/hooks/useCurrentUser";
 import { extractUsernameFromName, useUserStore } from "@/store/v1";
 import { Memo } from "@/types/proto/api/v2/memo_service";
 import { Reaction, Reaction_Type } from "@/types/proto/api/v2/reaction_service";
@@ -14,6 +15,7 @@ interface Props {
 
 const MemoReactionListView = (props: Props) => {
   const { memo, reactions } = props;
+  const currentUser = useCurrentUser();
   const userStore = useUserStore();
   const [reactionGroup, setReactionGroup] = useState<Map<Reaction_Type, User[]>>(new Map());
 
@@ -31,8 +33,8 @@ const MemoReactionListView = (props: Props) => {
   }, [reactions]);
 
   return (
-    <div className="w-full mt-2 flex flex-row justify-start items-start flex-wrap gap-1">
-      <ReactionSelector memo={memo} />
+    <div className="w-full mt-2 flex flex-row justify-start items-start flex-wrap gap-1 select-none">
+      {currentUser && <ReactionSelector memo={memo} />}
       {Array.from(reactionGroup).map(([reactionType, users]) => {
         return <ReactionView key={`${reactionType.toString()} ${users.length}`} memo={memo} reactionType={reactionType} users={users} />;
       })}

web/src/components/MemoView.tsx

@@ -20,7 +20,7 @@ import { showCommonDialog } from "./Dialog/CommonDialog";
 import Icon from "./Icon";
 import MemoContent from "./MemoContent";
 import showMemoEditorDialog from "./MemoEditor/MemoEditorDialog";
-import MemoReactionistView from "./MemoReactionistView";
+import MemoReactionistView from "./MemoReactionListView";
 import MemoRelationListView from "./MemoRelationListView";
 import MemoResourceListView from "./MemoResourceListView";
 import showPreviewImageDialog from "./PreviewImageDialog";

web/src/components/ReactionSelector.tsx

@@ -14,11 +14,11 @@ interface Props {
 
 const REACTION_TYPES = [
   Reaction_Type.THUMBS_UP,
+  Reaction_Type.THUMBS_DOWN,
+  Reaction_Type.LAUGH,
   Reaction_Type.HEART,
   Reaction_Type.ROCKET,
-  Reaction_Type.LAUGH,
   Reaction_Type.EYES,
-  Reaction_Type.THUMBS_DOWN,
 ];
 
 const ReactionSelector = (props: Props) => {

web/src/components/ReactionView.tsx

@@ -40,9 +40,9 @@ const stringifyUsers = (users: User[]): string => {
     return users.map((user) => user.nickname || user.username).join(", ");
   }
   return `${users
-    .slice(0, 5)
+    .slice(0, 4)
     .map((user) => user.nickname || user.username)
-    .join(", ")} and ${users.length - 5} others`;
+    .join(", ")} and ${users.length - 4} others`;
 };
 
 const ReactionView = (props: Props) => {