chore: update memo creator display

web/src/components/MemoView.tsx

@@ -24,6 +24,7 @@ import VisibilityIcon from "./VisibilityIcon";
 interface Props {
   memo: Memo;
   compact?: boolean;
+  showCreator?: boolean;
   showVisibility?: boolean;
   showPinned?: boolean;
   className?: string;
@@ -85,7 +86,7 @@ const MemoView: React.FC<Props> = (props: Props) => {
     >
       <div className="w-full flex flex-row justify-between items-center gap-2">
         <div className="w-auto max-w-[calc(100%-8rem)] grow flex flex-row justify-start items-center">
-          {creator && (
+          {props.showCreator && creator ? (
             <div className="w-full flex flex-row justify-start items-center">
               <Link className="w-auto hover:opacity-80" to={`/u/${encodeURIComponent(creator.username)}`} unstable_viewTransition>
                 <UserAvatar className="mr-2 shrink-0" avatarUrl={creator.avatarUrl} />
@@ -106,6 +107,10 @@ const MemoView: React.FC<Props> = (props: Props) => {
                 </div>
               </div>
             </div>
+          ) : (
+            <div className="w-full text-sm leading-tight text-gray-400 dark:text-gray-500 select-none" onClick={handleGotoMemoDetailPage}>
+              <relative-time datetime={memo.displayTime?.toISOString()} format={relativeTimeFormat} tense="past"></relative-time>
+            </div>
           )}
         </div>
         <div className="flex flex-row justify-end items-center select-none shrink-0 gap-2">

web/src/pages/Explore.tsx

@@ -66,7 +66,7 @@ const Explore = () => {
           <div className="flex flex-col justify-start items-start w-full max-w-full">
             <MemoFilter className="px-2 pb-2" />
             {sortedMemos.map((memo) => (
-              <MemoView key={`${memo.name}-${memo.updateTime}`} memo={memo} showVisibility showPinned />
+              <MemoView key={`${memo.name}-${memo.updateTime}`} memo={memo} showCreator showVisibility showPinned />
             ))}
             {isRequesting ? (
               <div className="flex flex-row justify-center items-center w-full my-4 text-gray-400">

web/src/pages/MemoDetail.tsx

@@ -86,6 +86,7 @@ const MemoDetail = () => {
           className="shadow hover:shadow-xl transition-all"
           memo={memo}
           compact={false}
+          showCreator
           showVisibility
           showPinned
         />
@@ -107,7 +108,7 @@ const MemoDetail = () => {
                   <span className="text-gray-400 text-sm ml-0.5">({comments.length})</span>
                 </div>
                 {comments.map((comment) => (
-                  <MemoView key={`${memo.name}-${memo.displayTime}`} memo={comment} />
+                  <MemoView key={`${memo.name}-${memo.displayTime}`} memo={comment} showCreator />
                 ))}
               </>
             )}