chore: tweak max width

web/src/components/MemoEditor/ActionButton/UploadResourceButton.tsx

@@ -38,12 +38,7 @@ const UploadResourceButton = () => {
       if (!fileInputRef.current || !fileInputRef.current.files) {
         return;
       }
-      const filesOnInput = Array.from(fileInputRef.current.files);
       for (const file of fileInputRef.current.files) {
-        const fileOnInput = filesOnInput.find((fileOnInput) => fileOnInput.name === file.name);
-        if (!fileOnInput) {
-          continue;
-        }
         const { name: filename, size, type } = file;
         const buffer = new Uint8Array(await file.arrayBuffer());
         const resource = await resourceStore.createResource({
@@ -65,7 +60,7 @@ const UploadResourceButton = () => {
   };
 
   return (
-    <IconButton size="sm">
+    <IconButton size="sm" disabled={state.uploadingFlag}>
       <Icon.Paperclip className="w-5 h-5 mx-auto" />
       <input
         className="absolute inset-0 w-full h-full opacity-0 cursor-pointer"

web/src/components/MemoResourceListView.tsx

@@ -1,5 +1,4 @@
 import { memo } from "react";
-import { absolutifyLink } from "@/helpers/utils";
 import { Resource } from "@/types/proto/api/v1/resource_service";
 import { getResourceType, getResourceUrl } from "@/utils/resource";
 import MemoResource from "./MemoResource";
@@ -28,7 +27,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
     showPreviewImageDialog(imgUrls, index);
   };
 
-  const MediaCard = ({ resource, thumbnail }: { resource: Resource; thumbnail?: boolean }) => {
+  const MediaCard = ({ resource }: { resource: Resource }) => {
     const type = getResourceType(resource);
     const url = getResourceUrl(resource);
 
@@ -36,7 +35,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
       return (
         <img
           className="cursor-pointer min-h-full w-auto object-cover"
-          src={resource.externalLink ? url : `${url}${thumbnail ? "?thumbnail=1" : ""}`}
+          src={url}
           onClick={() => handleImageClick(url)}
           decoding="async"
           loading="lazy"
@@ -48,7 +47,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
           className="cursor-pointer w-full h-full object-contain bg-zinc-100 dark:bg-zinc-800"
           preload="metadata"
           crossOrigin="anonymous"
-          src={absolutifyLink(url)}
+          src={url}
           controls
         />
       );
@@ -73,7 +72,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
         key={resource.name}
         className="flex justify-center items-center border dark:border-zinc-900 rounded overflow-hidden hide-scrollbar hover:shadow-md"
       >
-        <MediaCard resource={resource} thumbnail />
+        <MediaCard resource={resource} />
       </SquareDiv>
     ));
 

web/src/pages/About.tsx

@@ -4,7 +4,7 @@ import MobileHeader from "@/components/MobileHeader";
 
 const About = () => {
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         <div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

web/src/pages/Archived.tsx

@@ -87,7 +87,7 @@ const Archived = () => {
   };
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         <div className="w-full flex flex-col justify-start items-start">

web/src/pages/Explore.tsx

@@ -55,7 +55,7 @@ const Explore = () => {
   };
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       {!md && (
         <MobileHeader>
           <ExploreSidebarDrawer />

web/src/pages/Home.tsx

@@ -69,7 +69,7 @@ const Home = () => {
   }, [memoList]);
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       {!md && (
         <MobileHeader>
           <HomeSidebarDrawer />

web/src/pages/Inboxes.tsx

@@ -23,7 +23,7 @@ const Inboxes = () => {
   }, []);
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         <div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

web/src/pages/MemoDetail.tsx

@@ -66,7 +66,7 @@ const MemoDetail = () => {
   };
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         {parentMemo && (

web/src/pages/NotFound.tsx

@@ -2,7 +2,7 @@ import MobileHeader from "@/components/MobileHeader";
 
 const NotFound = () => {
   return (
-    <section className="@container w-full max-w-5xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 grow flex flex-col justify-center items-center sm:px-6">
         <p className="font-medium">{"The page you are looking for can't be found."}</p>

web/src/pages/PermissionDenied.tsx

@@ -2,7 +2,7 @@ import MobileHeader from "@/components/MobileHeader";
 
 const PermissionDenied = () => {
   return (
-    <section className="@container w-full max-w-5xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 grow flex flex-col justify-center items-center sm:px-6">
         <p className="font-medium">Permission denied</p>

web/src/pages/Resources.tsx

@@ -74,7 +74,7 @@ const Resources = () => {
   };
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         <div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

web/src/pages/Setting.tsx

@@ -57,7 +57,7 @@ const Setting = () => {
   }, []);
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-start sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-start sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6">
         <div className="w-full shadow flex flex-row justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-gray-600 dark:text-gray-400">

web/src/pages/Timeline.tsx

@@ -119,7 +119,7 @@ const Timeline = () => {
   };
 
   return (
-    <section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       {!md && (
         <MobileHeader>
           <TimelineSidebarDrawer />

web/src/pages/UserProfile.tsx

@@ -100,7 +100,7 @@ const UserProfile = () => {
   };
 
   return (
-    <section className="w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
+    <section className="w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
       <MobileHeader />
       <div className="w-full px-4 sm:px-6 flex flex-col justify-start items-center">
         {!loadingState.isLoading &&