separate pfp from normal pic

Author: aster-void

server/src/database/picture.ts

@@ -17,7 +17,7 @@ export async function set(guid: GUID, buf: Buffer): Promise<Result<string>> {
     })
     .then(() => {
       // ?update=${date} is necessary to let the browsers properly cache the image.
-      const pictureUrl = `/picture/${guid}?update=${new Date().getTime()}`;
+      const pictureUrl = `/picture/profile/${guid}?update=${new Date().getTime()}`;
       return Ok(pictureUrl);
     })
     .catch((err) => {

server/src/router/picture.ts

@@ -4,15 +4,17 @@ import * as storage from "../database/picture";
 import { safeGetGUID } from "../firebase/auth/lib";
 import { compressImage } from "../functions/img/compress";
 
-// TODO: truncate file at frontend s.t. even the largest file won't trigger the limit
 const parseLargeBuffer = bodyParser.raw({
   type: "image/png",
-  // TODO: block large files (larger than 1mb? idk)
   limit: "5mb",
 });
 const router = express.Router();
 
-router.get("/:guid", async (req, res) => {
+/* General Pictures in chat */
+
+/* Profile Pictures */
+
+router.get("/profile/:guid", async (req, res) => {
   const guid = req.params.guid;
   const result = await storage.get(guid);
   switch (result.ok) {
@@ -23,7 +25,7 @@ router.get("/:guid", async (req, res) => {
   }
 });
 
-router.post("/", parseLargeBuffer, async (req, res) => {
+router.post("/profile", parseLargeBuffer, async (req, res) => {
   const guid = await safeGetGUID(req);
   if (!guid.ok) return res.status(401).send();
 

web/src/api/internal/endpoints.ts

@@ -359,12 +359,13 @@ export const message = (messageId: MessageID) =>
 /**
  * GET: get profile picture of URL (this is usually hard-encoded in pictureURL so this variable is barely used)
  */
-export const pictureOf = (guid: GUID) => `${origin}/picture/${guid}`;
+export const profilePictureOf = (guid: GUID) =>
+  `${origin}/picture/profile/${guid}`;
 
 /**
  * POST: update my profile picture.
  */
-export const picture = `${origin}/picture`;
+export const profilePicture = `${origin}/picture/profile`;
 
 export default {
   user,
@@ -393,6 +394,6 @@ export default {
   message,
   coursesMine,
   coursesMineOverlaps,
-  pictureOf,
-  picture,
+  profilePictureOf,
+  profilePicture,
 };

web/src/api/internal/fetch-func.ts

@@ -26,13 +26,16 @@ export async function uploadImage(file: File): Promise<URL> {
   if (file.size >= MAX_IMAGE_SIZE) {
     throw new Error("画像のアップロードに失敗しました: 画像が大きすぎます");
   }
-  const res = await fetch(`${endpoints.picture}?token=${await getIdToken()}`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "image/png",
+  const res = await fetch(
+    `${endpoints.profilePicture}?token=${await getIdToken()}`,
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": "image/png",
+      },
+      body: file,
     },
-    body: file,
-  });
+  );
   if (res.status !== 201)
     throw new Error(
       `Unexpected status code: expected 201, but got ${res.status}`,