medias-fakerator 1.0.0-dra

package/lib/generators.js

@@ -0,0 +1,3220 @@
+const fs = require("fs-extra");
+const path = require("path");
+const sharp = require("sharp");
+const emojiImageByBrandPromise = require("emoji-cache");
+const ffmpeg = require("fluent-ffmpeg");
+const ffmpegInstaller = require("@ffmpeg-installer/ffmpeg");
+const { createCanvas, loadImage, registerFont } = require("canvas");
+const {
+  parseTextToSegments,
+  rebuildLinesFromSegments,
+  getContrastColor,
+} = require("./utils.js");
+registerFont(path.join(__dirname, "../assets/fonts/SfProDisplay.ttf"), {
+  family: "SfProDisplay",
+});
+registerFont(path.join(__dirname, "../assets/fonts/Noto-Bold.ttf"), {
+  family: "NotoBold",
+});
+registerFont(path.join(__dirname, "../assets/fonts/Noto-Regular.ttf"), {
+  family: "NotoRegular",
+});
+registerFont(path.join(__dirname, "../assets/fonts/Chirp-Regular.ttf"), {
+  family: "ChirpRegular",
+});
+ffmpeg.setFfmpegPath(ffmpegInstaller.path);
+
+function drawRoundRect(ctx, x, y, width, height, radius) {
+  ctx.beginPath();
+  ctx.moveTo(x + radius, y);
+  ctx.lineTo(x + width - radius, y);
+  ctx.arcTo(x + width, y, x + width, y + radius, radius);
+  ctx.lineTo(x + width, y + height - radius);
+  ctx.arcTo(x + width, y + height, x + width - radius, y + height, radius);
+  ctx.lineTo(x + radius, y + height);
+  ctx.arcTo(x, y + height, x, y + height - radius, radius);
+  ctx.lineTo(x, y + radius);
+  ctx.arcTo(x, y, x + radius, y, radius);
+  ctx.closePath();
+}
+function formatStatNumber(value) {
+  if (value === null || value === undefined) return "";
+
+  const num =
+    typeof value === "number"
+      ? value
+      : parseFloat(String(value).replace(/,/g, ""));
+
+  if (!isFinite(num)) return String(value);
+
+  if (num >= 1_000_000_000) {
+    return (num / 1_000_000_000).toFixed(1).replace(/\.0$/, "") + "B";
+  }
+  if (num >= 1_000_000) {
+    return (num / 1_000_000).toFixed(1).replace(/\.0$/, "") + "M";
+  }
+  if (num >= 1_000) {
+    return (num / 1_000).toFixed(1).replace(/\.0$/, "") + "K";
+  }
+
+  return num.toString();
+}
+
+function drawWrappedText(ctx, text, x, y, maxWidth, lineHeight) {
+  if (!text) return y + lineHeight;
+
+  const words = text.split(" ");
+  let line = "";
+
+  for (let i = 0; i < words.length; i++) {
+    const testLine = line + words[i] + " ";
+    const metrics = ctx.measureText(testLine);
+
+    if (metrics.width > maxWidth && line !== "") {
+      ctx.fillText(line, x, y);
+      line = words[i] + " ";
+      y += lineHeight;
+    } else {
+      line = testLine;
+    }
+  }
+
+  ctx.fillText(line, x, y);
+  return y + lineHeight;
+}
+
+function isHighlighted(highlightList, segmentContent) {
+  if (
+    !segmentContent ||
+    typeof segmentContent !== "string" ||
+    !highlightList ||
+    highlightList.length === 0
+  )
+    return false;
+  const cleanFormatting = (str) => {
+    if (str.startsWith("```") && str.endsWith("```")) return str.slice(3, -3);
+    if (
+      (str.startsWith("*_") && str.endsWith("_*")) ||
+      (str.startsWith("_*") && str.endsWith("*_"))
+    )
+      return str.slice(2, -2);
+    if (
+      (str.startsWith("*") && str.endsWith("*")) ||
+      (str.startsWith("_") && str.endsWith("_")) ||
+      (str.startsWith("~") && str.endsWith("~"))
+    )
+      return str.slice(1, -1);
+    return str;
+  };
+  const contentLower = segmentContent.toLowerCase();
+  for (const rawHighlightWord of highlightList) {
+    const cleanedHighlightWord =
+      cleanFormatting(rawHighlightWord).toLowerCase();
+    if (cleanedHighlightWord === contentLower) {
+      return true;
+    }
+  }
+  return false;
+}
+
+function wrapText(ctx, text, maxWidth) {
+  const words = text.split(" ");
+  const lines = [];
+  let currentLine = words[0];
+
+  for (let i = 1; i < words.length; i++) {
+    const word = words[i];
+    const width = ctx.measureText(currentLine + " " + word).width;
+    if (width < maxWidth) {
+      currentLine += " " + word;
+    } else {
+      lines.push(currentLine);
+      currentLine = word;
+    }
+  }
+  lines.push(currentLine);
+  return lines;
+}
+
+async function generateFakeStory(options = {}) {
+  const allEmojiImages = await emojiImageByBrandPromise;
+  const emojiCache = allEmojiImages["apple"] || {};
+  const {
+    caption,
+    username,
+    profilePicBuffer,
+    backgroundPath = path.join(
+      __dirname,
+      "..",
+      "assets",
+      "images",
+      "instagram",
+      "fakestory.png"
+    ),
+  } = options;
+  if (!caption || !username || !profilePicBuffer)
+    throw new Error("Caption, username, dan profilePicBuffer wajib diisi.");
+  const bg = await loadImage(backgroundPath);
+  const pp = await loadImage(profilePicBuffer);
+  const canvas = createCanvas(bg.width, bg.height);
+  const ctx = canvas.getContext("2d");
+  ctx.drawImage(bg, 0, 0, canvas.width, canvas.height);
+  const ppX = 40;
+  const ppY = 250;
+  const ppSize = 70;
+  ctx.save();
+  ctx.beginPath();
+  ctx.arc(ppX + ppSize / 2, ppY + ppSize / 2, ppSize / 2, 0, Math.PI * 2);
+  ctx.closePath();
+  ctx.clip();
+  ctx.drawImage(pp, ppX, ppY, ppSize, ppSize);
+  ctx.restore();
+  ctx.font = "28px Arial";
+  ctx.fillStyle = "#FFFFFF";
+  ctx.textAlign = "left";
+  ctx.textBaseline = "middle";
+  const usernameX = ppX + ppSize + 15;
+  const usernameY = ppY + ppSize / 2;
+  ctx.fillText(username, usernameX, usernameY);
+  const padding = 60;
+  const maxWidth = canvas.width - padding * 2;
+  const maxHeight = 500;
+  let fontSize = 42;
+  let finalLines = [];
+  let lineHeight = 0;
+  let finalFontSize = 0;
+  while (fontSize > 10) {
+    ctx.font = `${fontSize}px Arial`;
+    const segments = parseTextToSegments(caption, ctx, fontSize);
+    const lines = rebuildLinesFromSegments(segments, maxWidth, ctx, fontSize);
+    let isTooWide = false;
+    for (const line of lines) {
+      const lineWidth = line.reduce((sum, seg) => sum + seg.width, 0);
+      if (lineWidth > maxWidth) {
+        isTooWide = true;
+        break;
+      }
+    }
+    const currentLineHeight = fontSize * 1.3;
+    const totalHeight = lines.length * currentLineHeight;
+    if (totalHeight <= maxHeight && !isTooWide) {
+      finalLines = lines;
+      lineHeight = currentLineHeight;
+      finalFontSize = fontSize;
+      break;
+    }
+    fontSize -= 2;
+  }
+  ctx.textBaseline = "top";
+  const captionX = canvas.width / 2;
+  const totalTextHeight = finalLines.length * lineHeight;
+  const startY = canvas.height / 2 - totalTextHeight / 2 + 50;
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = Math.max(2, finalFontSize / 15);
+  for (let i = 0; i < finalLines.length; i++) {
+    const line = finalLines[i];
+    const totalLineWidth = line.reduce((sum, seg) => sum + seg.width, 0);
+    let currentX = captionX - totalLineWidth / 2;
+    const currentLineY = startY + i * lineHeight;
+    for (const segment of line) {
+      ctx.fillStyle = "#FFFFFF";
+      switch (segment.type) {
+        case "bold":
+          ctx.font = `bold ${finalFontSize}px Arial`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          break;
+        case "italic":
+          ctx.font = `italic ${finalFontSize}px Arial`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          break;
+        case "bolditalic":
+          ctx.font = `italic bold ${finalFontSize}px Arial`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          break;
+        case "monospace":
+          ctx.font = `${finalFontSize}px 'Courier New', monospace`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          break;
+        case "strikethrough":
+          ctx.font = `${finalFontSize}px Arial`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          const strikeY = currentLineY + finalFontSize / 2;
+          ctx.beginPath();
+          ctx.moveTo(currentX, strikeY);
+          ctx.lineTo(currentX + segment.width, strikeY);
+          ctx.stroke();
+          break;
+        case "emoji":
+          const emojiImg = await loadImage(
+            Buffer.from(emojiCache[segment.content], "base64")
+          );
+          const emojiDrawY = currentLineY + (lineHeight - finalFontSize) / 2;
+          ctx.drawImage(
+            emojiImg,
+            currentX,
+            emojiDrawY,
+            finalFontSize,
+            finalFontSize
+          );
+          break;
+        case "text":
+        case "whitespace":
+        default:
+          ctx.font = `${finalFontSize}px Arial`;
+          ctx.fillText(segment.content, currentX, currentLineY);
+          break;
+      }
+      currentX += segment.width;
+    }
+  }
+  return canvas.toBuffer("image/png");
+}
+async function generateFakeTweet(options = {}) {
+  const allEmojiImages = await emojiImageByBrandPromise;
+  const emojiCache = allEmojiImages["apple"] || {};
+
+  const {
+    comment = "Ini adalah contoh tweet *tebal* dan _miring_.\nJuga ~salah~ dan ```monospace```. ✨",
+    user = { displayName: "Pengembang Handal", username: "js_master" },
+    avatarUrl = path.join(__dirname, "..", "assets", "fotobot.jpeg"),
+    verified = false,
+    backgroundColor = "#15202b",
+    font = { name: "Chirp", path: null },
+
+    mediaUrl = null,
+    mediaType = "image",
+    videoDuration = "0:10",
+
+    stats = {
+      replies: 0,
+      reposts: 0,
+      quotes: 0,
+      likes: 0,
+      bookmarks: 0,
+      views: null,
+    },
+
+    timestamp = "2:13 PM · 14 Oct 25",
+  } = options;
+
+  try {
+    const textColor = getContrastColor(backgroundColor);
+    const mutedColor = textColor === "#FFFFFF" ? "#8493a2" : "#536471";
+    const lineColor = textColor === "#FFFFFF" ? "#38444d" : "#cfd9de";
+
+    if (font.path && fs.existsSync(font.path)) {
+      registerFont(font.path, { family: font.name });
+    } else {
+      const defaultFontPath = path.join(
+        __dirname,
+        "..",
+        "assets",
+        "fonts",
+        "Chirp-Regular.ttf"
+      );
+      if (fs.existsSync(defaultFontPath)) {
+        registerFont(defaultFontPath, { family: "Chirp" });
+      }
+    }
+
+    const tempCtx = createCanvas(1, 1).getContext("2d");
+    const commentFontSize = 25;
+    const commentLineHeight = 40;
+    const commentMaxWidth = 800;
+    tempCtx.font = `${commentFontSize}px "${font.name}"`;
+
+    const segments = parseTextToSegments(comment, tempCtx, commentFontSize);
+    const commentLines = rebuildLinesFromSegments(
+      segments,
+      commentMaxWidth,
+      tempCtx,
+      commentFontSize
+    );
+
+    const totalCommentHeight = commentLines.length * commentLineHeight;
+
+    let mediaHeight = 0;
+    let mediaImage = null;
+    const mediaMarginTop = 20;
+    const mediaMarginBottom = 20;
+    const mediaPadding = 30;
+    const canvasWidth = 968;
+    const mediaWidth = canvasWidth - mediaPadding * 2;
+
+    if (mediaUrl) {
+      try {
+        mediaImage = await loadImage(mediaUrl);
+
+        const aspectRatio = mediaImage.height / mediaImage.width;
+        const calculatedHeight = mediaWidth * aspectRatio;
+
+        mediaHeight = Math.max(300, Math.min(900, calculatedHeight));
+      } catch (err) {
+        console.error("Gagal memuat media:", err.message);
+      }
+    }
+
+    const baseHeight = 240;
+    const statsHeight = 80;
+    const footerHeight = 88;
+    const totalMediaHeight = mediaImage
+      ? mediaMarginTop + mediaHeight + mediaMarginBottom
+      : 0;
+
+    const finalHeight =
+      baseHeight +
+      totalCommentHeight +
+      totalMediaHeight +
+      statsHeight +
+      footerHeight;
+
+    const canvas = createCanvas(canvasWidth, finalHeight);
+    const ctx = canvas.getContext("2d");
+
+    ctx.fillStyle = backgroundColor;
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+    ctx.textBaseline = "alphabetic";
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.arc(80, 75, 40, 0, Math.PI * 2);
+    ctx.closePath();
+    ctx.clip();
+    const avatarImg = await loadImage(avatarUrl);
+    ctx.drawImage(avatarImg, 40, 35, 80, 80);
+    ctx.restore();
+
+    ctx.fillStyle = textColor;
+    ctx.textAlign = "left";
+    ctx.font = `bold 25px "${font.name}"`;
+    ctx.fillText(user.displayName, 140, 70);
+
+    if (verified) {
+      const textLength = ctx.measureText(user.displayName).width;
+      const verifiedIcon = await loadImage(
+        path.join(
+          __dirname,
+          "..",
+          "assets",
+          "images",
+          "tweet",
+          "twitter-verified.png"
+        )
+      );
+      ctx.drawImage(verifiedIcon, textLength + 150, 48, 30, 30);
+    }
+
+    ctx.font = `20px "${font.name}"`;
+    ctx.fillStyle = mutedColor;
+    ctx.fillText("@" + user.username, 140, 100);
+
+    try {
+      const otherIcon = await loadImage(
+        path.join(__dirname, "..", "assets", "images", "tweet", "other.png")
+      );
+      ctx.drawImage(otherIcon, 900, 40, 35, 35);
+    } catch (err) {
+      ctx.fillStyle = mutedColor;
+      ctx.font = "bold 30px Arial";
+      ctx.fillText("⋯", 900, 60);
+    }
+
+    const commentStartX = 40;
+    const commentStartY = 130;
+    ctx.textBaseline = "middle";
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 2;
+
+    for (let i = 0; i < commentLines.length; i++) {
+      const line = commentLines[i];
+      const lineCenterY =
+        commentStartY + i * commentLineHeight + commentLineHeight / 2;
+      let currentX = commentStartX;
+
+      for (const segment of line) {
+        ctx.fillStyle = textColor;
+        switch (segment.type) {
+          case "bold":
+            ctx.font = `bold ${commentFontSize}px Arial`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            break;
+          case "italic":
+            ctx.font = `italic ${commentFontSize}px Arial`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            break;
+          case "bolditalic":
+            ctx.font = `italic bold ${commentFontSize}px Arial`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            break;
+          case "monospace":
+            ctx.font = `${commentFontSize}px 'Courier New', monospace`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            break;
+          case "strikethrough":
+            ctx.font = `${commentFontSize}px Arial`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            const strikeY = lineCenterY;
+            ctx.beginPath();
+            ctx.moveTo(currentX, strikeY);
+            ctx.lineTo(currentX + segment.width, strikeY);
+            ctx.stroke();
+            break;
+          case "emoji":
+            const emojiImg = await loadImage(
+              Buffer.from(emojiCache[segment.content], "base64")
+            );
+            const emojiY = lineCenterY - commentFontSize / 2;
+            ctx.drawImage(
+              emojiImg,
+              currentX,
+              emojiY,
+              commentFontSize,
+              commentFontSize
+            );
+            break;
+          case "text":
+          case "whitespace":
+          default:
+            ctx.font = `${commentFontSize}px Arial`;
+            ctx.fillText(segment.content, currentX, lineCenterY);
+            break;
+        }
+        currentX += segment.width;
+      }
+    }
+
+    let currentY = commentStartY + totalCommentHeight;
+    if (mediaImage) {
+      currentY += mediaMarginTop;
+
+      const mediaX = mediaPadding;
+      const borderRadius = 16;
+
+      ctx.save();
+      ctx.beginPath();
+      ctx.moveTo(mediaX + borderRadius, currentY);
+      ctx.lineTo(mediaX + mediaWidth - borderRadius, currentY);
+      ctx.quadraticCurveTo(
+        mediaX + mediaWidth,
+        currentY,
+        mediaX + mediaWidth,
+        currentY + borderRadius
+      );
+      ctx.lineTo(mediaX + mediaWidth, currentY + mediaHeight - borderRadius);
+      ctx.quadraticCurveTo(
+        mediaX + mediaWidth,
+        currentY + mediaHeight,
+        mediaX + mediaWidth - borderRadius,
+        currentY + mediaHeight
+      );
+      ctx.lineTo(mediaX + borderRadius, currentY + mediaHeight);
+      ctx.quadraticCurveTo(
+        mediaX,
+        currentY + mediaHeight,
+        mediaX,
+        currentY + mediaHeight - borderRadius
+      );
+      ctx.lineTo(mediaX, currentY + borderRadius);
+      ctx.quadraticCurveTo(mediaX, currentY, mediaX + borderRadius, currentY);
+      ctx.closePath();
+      ctx.clip();
+
+      ctx.drawImage(mediaImage, mediaX, currentY, mediaWidth, mediaHeight);
+      ctx.restore();
+
+      if (mediaType === "video") {
+        const muteIconSize = 40;
+        const muteIconPadding = 12;
+        const muteX = mediaX + mediaWidth - muteIconSize - muteIconPadding;
+        const muteY = currentY + mediaHeight - muteIconSize - muteIconPadding;
+
+        ctx.fillStyle = "rgba(0, 0, 0, 0.6)";
+        ctx.beginPath();
+        ctx.arc(
+          muteX + muteIconSize / 2,
+          muteY + muteIconSize / 2,
+          muteIconSize / 2,
+          0,
+          Math.PI * 2
+        );
+        ctx.fill();
+
+        ctx.fillStyle = "#FFFFFF";
+        ctx.font = "20px Arial";
+        ctx.textAlign = "center";
+        ctx.textBaseline = "middle";
+        ctx.fillText("🔇", muteX + muteIconSize / 2, muteY + muteIconSize / 2);
+
+        ctx.fillStyle = "rgba(0, 0, 0, 0.75)";
+        ctx.font = "bold 16px Arial";
+        const durationWidth = ctx.measureText(videoDuration).width + 16;
+        const durationX = mediaX + 12;
+        const durationY = currentY + mediaHeight - 32;
+
+        ctx.beginPath();
+        ctx.roundRect(durationX, durationY, durationWidth, 24, 4);
+        ctx.fill();
+
+        ctx.fillStyle = "#FFFFFF";
+        ctx.textAlign = "left";
+        ctx.textBaseline = "middle";
+        ctx.fillText(videoDuration, durationX + 8, durationY + 12);
+      }
+
+      currentY += mediaHeight + mediaMarginBottom;
+    }
+
+    ctx.textAlign = "left";
+    ctx.textBaseline = "alphabetic";
+    ctx.font = `22px "${font.name}"`;
+    ctx.fillStyle = mutedColor;
+
+    let timestampText = timestamp;
+    if (stats.views) {
+      timestampText += ` · ${stats.views} Views`;
+    }
+    ctx.fillText(timestampText, 40, currentY + 20);
+    currentY += 50;
+
+    ctx.strokeStyle = lineColor;
+    ctx.lineWidth = 1;
+    ctx.beginPath();
+    ctx.moveTo(35, currentY - 20);
+    ctx.lineTo(canvas.width - 35, currentY - 20);
+    ctx.stroke();
+    currentY += 25;
+
+    const statsArray = [];
+    if (stats.reposts > 0 || stats.quotes > 0) {
+      const totalReposts = stats.reposts + (stats.quotes || 0);
+      statsArray.push({
+        label: "Reposts",
+        value: formatStatNumber(totalReposts),
+      });
+    }
+    if (stats.quotes > 0) {
+      statsArray.push({
+        label: "Quotes",
+        value: formatStatNumber(stats.quotes),
+      });
+    }
+    if (stats.likes > 0) {
+      statsArray.push({ label: "Likes", value: formatStatNumber(stats.likes) });
+    }
+    if (stats.bookmarks > 0) {
+      statsArray.push({
+        label: "Bookmarks",
+        value: formatStatNumber(stats.bookmarks),
+      });
+    }
+
+    let statsX = 35;
+    ctx.font = `bold 22px "${font.name}"`;
+    for (let i = 0; i < statsArray.length; i++) {
+      const stat = statsArray[i];
+
+      ctx.fillStyle = textColor;
+      ctx.fillText(stat.value, statsX, currentY);
+      const valueWidth = ctx.measureText(stat.value).width;
+
+      ctx.font = `22px "${font.name}"`;
+      ctx.fillStyle = mutedColor;
+      ctx.fillText(" " + stat.label, statsX + valueWidth, currentY);
+      const labelWidth = ctx.measureText(" " + stat.label).width;
+
+      statsX += valueWidth + labelWidth + 30;
+      ctx.font = `bold 22px "${font.name}"`;
+    }
+    currentY += 50;
+
+    ctx.strokeStyle = lineColor;
+    ctx.lineWidth = 1;
+    ctx.beginPath();
+    ctx.moveTo(35, currentY - 20);
+    ctx.lineTo(canvas.width - 35, currentY - 20);
+    ctx.stroke();
+    currentY += 20;
+
+    try {
+      const iconPath = (iconName) =>
+        path.join(__dirname, "..", "assets", "images", "tweet", iconName);
+
+      const iconY = currentY;
+      const iconSize = 45;
+      const icons = ["reply.png", "retweet.png", "like.png", "share.png"];
+      const iconCount = icons.length;
+
+      const padding = 100;
+      const totalWidth = canvas.width - padding * 2;
+
+      const iconSpacing = totalWidth / (iconCount - 1);
+
+      const startX = padding;
+
+      for (let i = 0; i < iconCount; i++) {
+        const x = startX + iconSpacing * i - iconSize / 2;
+        ctx.drawImage(
+          await loadImage(iconPath(icons[i])),
+          x,
+          iconY,
+          iconSize,
+          iconSize
+        );
+      }
+    } catch (err) {
+      console.error("Gagal memuat ikon tweet:", err.message);
+    }
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat kartu Tweet:", error);
+    return null;
+  }
+}
+async function generateFakeChatIphone(options = {}) {
+  const allEmojiImages = await emojiImageByBrandPromise;
+  const emojiCache = allEmojiImages["apple"] || {};
+  const {
+    text = "Ini adalah *contoh* IQC.\nMendukung _semua_ format ~Markdown~. ✨",
+    imageUrl = null,
+    chatTime = "11:02",
+    statusBarTime = "17:01",
+    bubbleColor = "#272a2f",
+    menuColor = "#272a2f",
+    textColor = "#FFFFFF",
+    fontName = "Arial",
+    side = "left",
+  } = options;
+
+  try {
+    const canvasWidth = 1320;
+    const canvasHeight = 2868;
+    const canvas = createCanvas(canvasWidth, canvasHeight);
+    const ctx = canvas.getContext("2d");
+
+    const iconPath = (iconName) =>
+      path.join(__dirname, "..", "assets", "images", "iphone", iconName);
+
+    const backgroundImage = await loadImage(iconPath("background.jpg"));
+    ctx.drawImage(backgroundImage, 0, 0, canvasWidth, canvasHeight);
+
+    ctx.fillStyle = textColor;
+    ctx.font = `bold 50px "${fontName}"`;
+    ctx.textBaseline = "middle";
+    ctx.textAlign = "left";
+    ctx.fillText(statusBarTime, 40, 80);
+    const statusIconY = 60;
+    const statusIconSize = 55;
+    const rightMargin = 40;
+    const iconSpacing = 20;
+    let currentX_status = canvasWidth - rightMargin - statusIconSize;
+    ctx.drawImage(
+      await loadImage(iconPath("battery.png")),
+      currentX_status,
+      statusIconY - 10,
+      statusIconSize,
+      statusIconSize * 1.5
+    );
+    currentX_status -= statusIconSize + iconSpacing;
+    ctx.drawImage(
+      await loadImage(iconPath("wifi.png")),
+      currentX_status,
+      statusIconY,
+      statusIconSize,
+      statusIconSize
+    );
+    currentX_status -= statusIconSize + iconSpacing;
+    ctx.drawImage(
+      await loadImage(iconPath("signal.png")),
+      currentX_status,
+      statusIconY,
+      statusIconSize,
+      statusIconSize
+    );
+
+    const startX = 40;
+    const bubbleSpacing = 20;
+    const emojiString = "👍❤️😂😮😢🙏🤔";
+    const emojiFontSize = 65;
+    const plusIconSize = 115;
+    const emojiPadding = 15;
+
+    ctx.font = `${emojiFontSize}px "${fontName}"`;
+    const emojiSegments = parseTextToSegments(emojiString, ctx, emojiFontSize);
+    let emojiContentWidth =
+      emojiSegments.reduce((sum, seg) => sum + seg.width + 20, 0) +
+      plusIconSize +
+      20;
+    const bubble1Width = emojiContentWidth + emojiPadding * 2 - 20;
+    const bubble1Height = 110;
+
+    let messageImage = null;
+    let imageWidth = 0;
+    let imageHeight = 0;
+    const maxImageWidth = 900;
+    const maxImageHeight = 900;
+    const minImageWidth = 350;
+
+    if (imageUrl) {
+      try {
+        messageImage = await loadImage(imageUrl);
+        const aspectRatio = messageImage.width / messageImage.height;
+
+        imageWidth = messageImage.width;
+        imageHeight = messageImage.height;
+
+        if (imageWidth > maxImageWidth || imageHeight > maxImageHeight) {
+          if (aspectRatio > 1) {
+            imageWidth = Math.min(imageWidth, maxImageWidth);
+            imageHeight = imageWidth / aspectRatio;
+
+            if (imageHeight > maxImageHeight) {
+              imageHeight = maxImageHeight;
+              imageWidth = imageHeight * aspectRatio;
+            }
+          } else {
+            imageHeight = Math.min(imageHeight, maxImageHeight);
+            imageWidth = imageHeight * aspectRatio;
+
+            if (imageWidth > maxImageWidth) {
+              imageWidth = maxImageWidth;
+              imageHeight = imageWidth / aspectRatio;
+            }
+          }
+        }
+
+        if (imageWidth < minImageWidth) {
+          imageWidth = minImageWidth;
+          imageHeight = imageWidth / aspectRatio;
+        }
+      } catch (err) {
+        console.error("Gagal memuat gambar:", err);
+        messageImage = null;
+      }
+    }
+
+    const textFontSize = 52;
+    const textLineHeight = textFontSize * 1.4;
+    const textMaxWidth = canvasWidth - startX - 40;
+    const bubblePadding = 40;
+    const imagePadding = 20;
+
+    ctx.font = `bold ${textFontSize}px "${fontName}"`;
+    const textSegments = parseTextToSegments(text, ctx, textFontSize);
+    const textLines = rebuildLinesFromSegments(
+      textSegments,
+      textMaxWidth - bubblePadding * 2,
+      ctx,
+      textFontSize
+    );
+
+    let bubble2Width;
+    let bubble2Height;
+
+    let textContentWidth;
+    if (textLines.length === 1) {
+      textContentWidth =
+        textLines[0].reduce((sum, seg) => sum + seg.width, 0) +
+        bubblePadding * 2;
+    } else {
+      textContentWidth = Math.min(textMaxWidth, canvasWidth * 0.7);
+    }
+
+    if (messageImage) {
+      const minBubbleWidth = imageWidth + imagePadding * 2;
+      bubble2Width = Math.max(textContentWidth, minBubbleWidth);
+
+      const textHeight = textLines.length * textLineHeight;
+      bubble2Height =
+        imageHeight + imagePadding + textHeight + bubblePadding * 2;
+    } else {
+      bubble2Width = textContentWidth;
+      bubble2Height = textLines.length * textLineHeight + bubblePadding * 2;
+    }
+
+    const menuItems = [
+      { text: "Reply", icon: "reply.png" },
+      { text: "Forward", icon: "forward.png" },
+      { text: "Copy", icon: "copy.png" },
+      { text: "Star", icon: "star.png" },
+      { text: "Pin", icon: "pin.png" },
+      { text: "Report", icon: "report.png" },
+      { text: "Delete", icon: "delete.png", color: "#ff453a" },
+    ];
+    const menuItemHeight = 110;
+    const bubble3Width = (canvasWidth * 4) / 9 - startX;
+    const bubble3Height = menuItems.length * menuItemHeight;
+
+    const sequentialBlockHeight = bubble1Height + bubbleSpacing + bubble2Height;
+    const centeredY = (canvasHeight - sequentialBlockHeight) / 2;
+    const verticalOffset = -300;
+    const topLimitY = 200;
+    const startY = Math.max(centeredY + verticalOffset, topLimitY);
+    const bubble1Y = startY;
+    const bubble2Y = bubble1Y + bubble1Height + bubbleSpacing;
+
+    let bubble3Y;
+    const bottomLimitY = canvasHeight - 100;
+    const normal_bubble3Y = bubble2Y + bubble2Height + bubbleSpacing;
+    bubble3Y =
+      normal_bubble3Y + bubble3Height >= bottomLimitY
+        ? bottomLimitY - bubble3Height
+        : normal_bubble3Y;
+
+    const getBubbleX = (width) =>
+      side === "left" ? startX : canvasWidth - startX - width;
+
+    const finalBubbleColor = side === "right" ? "#015347" : bubbleColor;
+
+    ctx.fillStyle = menuColor;
+    drawRoundRect(
+      ctx,
+      getBubbleX(bubble1Width),
+      bubble1Y,
+      bubble1Width,
+      bubble1Height,
+      50
+    );
+    ctx.fill();
+    let currentEmojiX = getBubbleX(bubble1Width) + emojiPadding;
+    for (const segment of emojiSegments) {
+      const emojiImg = await loadImage(
+        Buffer.from(emojiCache[segment.content], "base64")
+      );
+      ctx.drawImage(
+        emojiImg,
+        currentEmojiX,
+        bubble1Y + (bubble1Height - emojiFontSize) / 2,
+        emojiFontSize,
+        emojiFontSize
+      );
+      currentEmojiX += segment.width + 20;
+    }
+    ctx.drawImage(
+      await loadImage(iconPath("plus.png")),
+      currentEmojiX,
+      bubble1Y + (bubble1Height - plusIconSize) / 2,
+      plusIconSize,
+      plusIconSize
+    );
+
+    ctx.fillStyle = finalBubbleColor;
+    drawRoundRect(
+      ctx,
+      getBubbleX(bubble2Width),
+      bubble2Y,
+      bubble2Width,
+      bubble2Height,
+      45
+    );
+    ctx.fill();
+
+    let contentStartY = bubble2Y + bubblePadding;
+
+    if (messageImage) {
+      ctx.save();
+
+      const availableWidth = bubble2Width - imagePadding * 2;
+      const imgX =
+        getBubbleX(bubble2Width) +
+        imagePadding +
+        (availableWidth - imageWidth) / 2;
+      const imgY = contentStartY;
+
+      ctx.beginPath();
+      ctx.moveTo(imgX + 30, imgY);
+      ctx.lineTo(imgX + imageWidth - 30, imgY);
+      ctx.quadraticCurveTo(
+        imgX + imageWidth,
+        imgY,
+        imgX + imageWidth,
+        imgY + 30
+      );
+      ctx.lineTo(imgX + imageWidth, imgY + imageHeight - 30);
+      ctx.quadraticCurveTo(
+        imgX + imageWidth,
+        imgY + imageHeight,
+        imgX + imageWidth - 30,
+        imgY + imageHeight
+      );
+      ctx.lineTo(imgX + 30, imgY + imageHeight);
+      ctx.quadraticCurveTo(
+        imgX,
+        imgY + imageHeight,
+        imgX,
+        imgY + imageHeight - 30
+      );
+      ctx.lineTo(imgX, imgY + 30);
+      ctx.quadraticCurveTo(imgX, imgY, imgX + 30, imgY);
+      ctx.closePath();
+      ctx.clip();
+
+      ctx.drawImage(messageImage, imgX, imgY, imageWidth, imageHeight);
+      ctx.restore();
+
+      contentStartY += imageHeight + imagePadding;
+    }
+
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 3;
+    for (let i = 0; i < textLines.length; i++) {
+      const line = textLines[i];
+      let currentTextX = getBubbleX(bubble2Width) + bubblePadding;
+      const lineY = contentStartY + i * textLineHeight;
+      ctx.textBaseline = "top";
+      for (const segment of line) {
+        ctx.fillStyle = textColor;
+        switch (segment.type) {
+          case "bold":
+            ctx.font = `bold ${textFontSize}px "${fontName}"`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            break;
+          case "italic":
+            ctx.font = `italic ${textFontSize}px "${fontName}"`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            break;
+          case "bolditalic":
+            ctx.font = `italic bold ${textFontSize}px "${fontName}"`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            break;
+          case "monospace":
+            ctx.font = `${textFontSize}px 'Courier New', monospace`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            break;
+          case "strikethrough":
+            ctx.font = `${textFontSize}px "${fontName}"`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            const strikeY = lineY + textFontSize / 2;
+            ctx.beginPath();
+            ctx.moveTo(currentTextX, strikeY);
+            ctx.lineTo(currentTextX + segment.width, strikeY);
+            ctx.stroke();
+            break;
+          case "emoji":
+            const emojiImg = await loadImage(
+              Buffer.from(emojiCache[segment.content], "base64")
+            );
+            ctx.drawImage(
+              emojiImg,
+              currentTextX,
+              lineY,
+              textFontSize,
+              textFontSize
+            );
+            break;
+          case "text":
+          case "whitespace":
+          default:
+            ctx.font = `${textFontSize}px "${fontName}"`;
+            ctx.fillText(segment.content, currentTextX, lineY);
+            break;
+        }
+        currentTextX += segment.width;
+      }
+    }
+
+    ctx.fillStyle = "#a0a0a0";
+    ctx.font = `34px "${fontName}"`;
+    ctx.textAlign = "right";
+    ctx.textBaseline = "bottom";
+    ctx.fillText(
+      chatTime,
+      getBubbleX(bubble2Width) + bubble2Width - bubblePadding / 1.5,
+      bubble2Y + bubble2Height - bubblePadding / 8
+    );
+
+    ctx.fillStyle = "rgba(39, 42, 47, 0.85)";
+    drawRoundRect(
+      ctx,
+      getBubbleX(bubble3Width),
+      bubble3Y,
+      bubble3Width,
+      bubble3Height,
+      40
+    );
+    ctx.fill();
+
+    for (let i = 0; i < menuItems.length; i++) {
+      const item = menuItems[i];
+      const itemY = bubble3Y + i * menuItemHeight;
+      ctx.fillStyle = item.color || textColor;
+      ctx.font = `50px "${fontName}"`;
+      ctx.textAlign = "left";
+      ctx.textBaseline = "middle";
+      ctx.fillText(
+        item.text,
+        getBubbleX(bubble3Width) + 40,
+        itemY + menuItemHeight / 2
+      );
+      const itemIcon = await loadImage(iconPath(item.icon));
+      const iconSize = 55;
+      const iconX = getBubbleX(bubble3Width) + bubble3Width - 40 - iconSize;
+      ctx.drawImage(
+        itemIcon,
+        iconX,
+        itemY + (menuItemHeight - iconSize) / 2,
+        iconSize,
+        iconSize
+      );
+      if (i < menuItems.length - 1) {
+        const lineY = itemY + menuItemHeight;
+        ctx.strokeStyle = "#555";
+        ctx.lineWidth = 2;
+        ctx.beginPath();
+        ctx.moveTo(getBubbleX(bubble3Width) + 40, lineY);
+        ctx.lineTo(getBubbleX(bubble3Width) + bubble3Width - 40, lineY);
+        ctx.stroke();
+      }
+    }
+
+    const indicatorWidth = 450;
+    const indicatorHeight = 15;
+    const indicatorX = (canvasWidth - indicatorWidth) / 2;
+    const indicatorY = canvasHeight - indicatorHeight - 20;
+    ctx.fillStyle = "#FFFFFF";
+    drawRoundRect(
+      ctx,
+      indicatorX,
+      indicatorY,
+      indicatorWidth,
+      indicatorHeight,
+      indicatorHeight / 2
+    );
+    ctx.fill();
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat gambar quote:", error);
+    return null;
+  }
+}
+
+async function generateFakeCallIphone(options = {}) {
+  const {
+    name = "Bubub",
+    duration = "02:20:19",
+    statusBarTime = "19:51",
+    profileImageUrl = null,
+    textColor = "#FFFFFF",
+    fontName = "Arial",
+  } = options;
+  try {
+    const canvasWidth = 731;
+    const canvasHeight = 1280;
+    const canvas = createCanvas(canvasWidth, canvasHeight);
+    const ctx = canvas.getContext("2d");
+    const iconPath = (iconName) =>
+      path.join(__dirname, "..", "assets", "images", "iphone", iconName);
+
+    const backgroundImage = await loadImage(iconPath("background-call.jpg"));
+    ctx.drawImage(backgroundImage, 0, 0, canvasWidth, canvasHeight);
+
+    const iconSize = 25;
+    const iconY = 0;
+    const leftMargin = 20;
+
+    ctx.drawImage(
+      await loadImage(iconPath("signal.png")),
+      leftMargin,
+      iconY,
+      iconSize,
+      iconSize
+    );
+
+    ctx.drawImage(
+      await loadImage(iconPath("wifi.png")),
+      leftMargin + iconSize + 5,
+      iconY,
+      iconSize,
+      iconSize
+    );
+
+    ctx.fillStyle = textColor;
+    ctx.font = `bold 26px "${fontName}"`;
+    ctx.textAlign = "center";
+    ctx.textBaseline = "middle";
+    ctx.fillText(statusBarTime, canvasWidth / 2, 14);
+
+    const batteryWidth = 40;
+    const batteryHeight = 40;
+    const rightMargin = 20;
+    ctx.drawImage(
+      await loadImage(iconPath("battery.png")),
+      canvasWidth - rightMargin - batteryWidth,
+      iconY - 5,
+      batteryWidth,
+      batteryHeight
+    );
+
+    const nameY = 95;
+    ctx.fillStyle = textColor;
+    ctx.font = `bold 40px Arial`;
+    ctx.textAlign = "center";
+    ctx.fillText(name, canvasWidth / 2, nameY);
+
+    const timerY = 150;
+    ctx.fillStyle = "#CCCCCC";
+    ctx.font = `25px "${fontName}"`;
+    ctx.textAlign = "center";
+    ctx.fillText(duration, canvasWidth / 2, timerY);
+
+    const profileSize = 400;
+    const profileX = (canvasWidth - profileSize) / 2;
+    const profileY = 380;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.arc(
+      profileX + profileSize / 2,
+      profileY + profileSize / 2,
+      profileSize / 2,
+      0,
+      Math.PI * 2
+    );
+    ctx.closePath();
+
+    if (profileImageUrl) {
+      try {
+        const profileImage = await loadImage(profileImageUrl);
+
+        const imgRatio = profileImage.width / profileImage.height;
+        const frameRatio = 1; // lingkaran → kotak
+
+        let srcX = 0,
+          srcY = 0,
+          srcW = profileImage.width,
+          srcH = profileImage.height;
+
+        if (imgRatio > frameRatio) {
+          // gambar lebih lebar → crop kiri kanan
+          srcW = profileImage.height;
+          srcX = (profileImage.width - srcW) / 2;
+        } else {
+          // gambar lebih tinggi → crop atas bawah
+          srcH = profileImage.width;
+          srcY = (profileImage.height - srcH) / 2;
+        }
+
+        ctx.clip();
+        ctx.drawImage(
+          profileImage,
+          srcX,
+          srcY,
+          srcW,
+          srcH,
+          profileX,
+          profileY,
+          profileSize,
+          profileSize
+        );
+      } catch (err) {
+        console.error("Gagal memuat gambar profil:", err);
+
+        ctx.fillStyle = "#8B8B8B";
+        ctx.fill();
+
+        ctx.restore();
+        ctx.save();
+        ctx.fillStyle = "#FFFFFF";
+
+        const iconCenterX = profileX + profileSize / 2;
+        const iconCenterY = profileY + profileSize / 2;
+
+        ctx.beginPath();
+        ctx.arc(iconCenterX, iconCenterY - 40, 60, 0, Math.PI * 2);
+        ctx.fill();
+
+        ctx.beginPath();
+        ctx.arc(iconCenterX, iconCenterY + 80, 110, 0, Math.PI * 2);
+        ctx.fill();
+      }
+    } else {
+      ctx.fillStyle = "#8B8B8B";
+      ctx.fill();
+
+      ctx.restore();
+      ctx.save();
+      ctx.fillStyle = "#FFFFFF";
+      const iconCenterX = profileX + profileSize / 2;
+      const iconCenterY = profileY + profileSize / 2;
+
+      ctx.beginPath();
+      ctx.arc(iconCenterX, iconCenterY - 40, 60, 0, Math.PI * 2);
+      ctx.fill();
+
+      ctx.beginPath();
+      ctx.arc(iconCenterX, iconCenterY + 80, 110, 0, Math.PI * 2);
+      ctx.fill();
+    }
+    ctx.restore();
+
+    const indicatorWidth = 250;
+    const indicatorHeight = 10;
+    const indicatorX = (canvasWidth - indicatorWidth) / 2;
+    const indicatorY = canvasHeight - indicatorHeight - 10;
+    ctx.fillStyle = "#FFFFFF";
+    drawRoundRect(
+      ctx,
+      indicatorX,
+      indicatorY,
+      indicatorWidth,
+      indicatorHeight,
+      indicatorHeight / 2
+    );
+    ctx.fill();
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat gambar fake call:", error);
+    return null;
+  }
+}
+
+async function generateFakeCallAndroid(options = {}) {
+  const {
+    name = "Bubub",
+    duration = "02:20:19",
+    statusBarTime = "19:51",
+    profileImageUrl = null,
+    textColor = "#FFFFFF",
+    fontName = "Arial",
+  } = options;
+  try {
+    const canvasWidth = 560;
+    const canvasHeight = 1280;
+    const canvas = createCanvas(canvasWidth, canvasHeight);
+    const ctx = canvas.getContext("2d");
+    const iconPath = (iconName) =>
+      path.join(__dirname, "..", "assets", "images", "android", iconName);
+
+    const backgroundImage = await loadImage(iconPath("background-call.jpg"));
+    ctx.drawImage(backgroundImage, 0, 0, canvasWidth, canvasHeight);
+
+    ctx.fillStyle = textColor;
+    ctx.font = `20px "${fontName}"`;
+    ctx.textAlign = "left";
+    ctx.textBaseline = "middle";
+    ctx.fillText(statusBarTime, 15, 14);
+
+    const nameY = 75;
+    ctx.fillStyle = textColor;
+    ctx.font = `bold 30px Arial`;
+    ctx.textAlign = "center";
+    ctx.fillText(name, canvasWidth / 2, nameY);
+
+    const timerY = 110;
+    ctx.fillStyle = "#CCCCCC";
+    ctx.font = `15px "${fontName}"`;
+    ctx.textAlign = "center";
+    ctx.fillText(duration, canvasWidth / 2, timerY);
+
+    const profileSize = 250;
+    const profileX = (canvasWidth - profileSize) / 2;
+    const profileY = 450;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.arc(
+      profileX + profileSize / 2,
+      profileY + profileSize / 2,
+      profileSize / 2,
+      0,
+      Math.PI * 2
+    );
+    ctx.closePath();
+
+    if (profileImageUrl) {
+      try {
+        const profileImage = await loadImage(profileImageUrl);
+
+        const imgRatio = profileImage.width / profileImage.height;
+        const frameRatio = 1; // lingkaran → kotak
+
+        let srcX = 0,
+          srcY = 0,
+          srcW = profileImage.width,
+          srcH = profileImage.height;
+
+        if (imgRatio > frameRatio) {
+          // gambar lebih lebar → crop kiri kanan
+          srcW = profileImage.height;
+          srcX = (profileImage.width - srcW) / 2;
+        } else {
+          // gambar lebih tinggi → crop atas bawah
+          srcH = profileImage.width;
+          srcY = (profileImage.height - srcH) / 2;
+        }
+
+        ctx.clip();
+        ctx.drawImage(
+          profileImage,
+          srcX,
+          srcY,
+          srcW,
+          srcH,
+          profileX,
+          profileY,
+          profileSize,
+          profileSize
+        );
+      } catch (err) {
+        console.error("Gagal memuat gambar profil:", err);
+
+        ctx.fillStyle = "#8B8B8B";
+        ctx.fill();
+
+        ctx.restore();
+        ctx.save();
+        ctx.fillStyle = "#FFFFFF";
+
+        const iconCenterX = profileX + profileSize / 2;
+        const iconCenterY = profileY + profileSize / 2;
+
+        ctx.beginPath();
+        ctx.arc(iconCenterX, iconCenterY - 25, 38, 0, Math.PI * 2);
+        ctx.fill();
+
+        ctx.beginPath();
+        ctx.arc(iconCenterX, iconCenterY + 50, 69, 0, Math.PI * 2);
+        ctx.fill();
+      }
+    } else {
+      ctx.fillStyle = "#8B8B8B";
+      ctx.fill();
+
+      ctx.restore();
+      ctx.save();
+      ctx.fillStyle = "#FFFFFF";
+      const iconCenterX = profileX + profileSize / 2;
+      const iconCenterY = profileY + profileSize / 2;
+
+      ctx.beginPath();
+      ctx.arc(iconCenterX, iconCenterY - 25, 38, 0, Math.PI * 2);
+      ctx.fill();
+
+      ctx.beginPath();
+      ctx.arc(iconCenterX, iconCenterY + 50, 69, 0, Math.PI * 2);
+      ctx.fill();
+    }
+    ctx.restore();
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat gambar fake call:", error);
+    return null;
+  }
+}
+
+async function generateInstagramProfile(options = {}) {
+  const {
+    username = "w.Iruka",
+    displayName = "w.Iruka イルカ",
+    note = "What's new?",
+    posts = "1",
+    followers = "399",
+    following = "29",
+    bio = "Nothing special, never stop flying... GET OUT!!!",
+    verified = true,
+    profileImageUrl = null,
+    bgColor = "#000000",
+    textColor = "#FFFFFF",
+    secondaryTextColor = "#A8A8A8",
+  } = options;
+
+  try {
+    const baseHeight = 530;
+    const canvasWidth = 1080;
+    const tempCanvas = createCanvas(canvasWidth, baseHeight);
+    const tempCtx = tempCanvas.getContext("2d");
+
+    tempCtx.font = '26px "SfProDisplay", sans-serif';
+    const bioLines = wrapText(tempCtx, bio, 1010);
+    const bioLineHeight = 38;
+    const bioHeight = bioLines.length * bioLineHeight;
+
+    const bottomPadding = 60;
+    const canvasHeight = 430 + bioHeight + bottomPadding;
+
+    const canvas = createCanvas(canvasWidth, canvasHeight);
+    const ctx = canvas.getContext("2d");
+
+    ctx.fillStyle = bgColor;
+    ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+
+    const headerCenterY = 100;
+
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 4;
+    ctx.lineCap = "round";
+
+    const plusCenterX = 45;
+    const plusHalfSize = 18;
+
+    ctx.beginPath();
+    ctx.moveTo(plusCenterX - plusHalfSize, headerCenterY - 8);
+    ctx.lineTo(plusCenterX + plusHalfSize, headerCenterY - 8);
+    ctx.stroke();
+
+    ctx.beginPath();
+    ctx.moveTo(plusCenterX, headerCenterY - plusHalfSize - 8);
+    ctx.lineTo(plusCenterX, headerCenterY + plusHalfSize - 8);
+    ctx.stroke();
+
+    ctx.fillStyle = textColor;
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 1;
+    ctx.font = '42px "SfProDisplay", sans-serif';
+    ctx.textAlign = "left";
+
+    const usernameMetrics = ctx.measureText(username);
+    const usernameWidth = usernameMetrics.width;
+    const ascent = usernameMetrics.actualBoundingBoxAscent || 0;
+    const descent = usernameMetrics.actualBoundingBoxDescent || 0;
+    const centerOffset = (descent - ascent) / 2;
+
+    const dropSize = 10;
+    const dropdownWidth = dropSize * 2;
+    const gapUsernameToDropdown = 15;
+
+    const groupWidth = usernameWidth + gapUsernameToDropdown + dropdownWidth;
+    const groupStartX = (canvasWidth - groupWidth) / 2;
+
+    const usernameX = groupStartX;
+    const dropdownCenterX =
+      usernameX + usernameWidth + gapUsernameToDropdown + dropSize;
+    const usernameBaselineY = headerCenterY - centerOffset;
+
+    ctx.fillText(username, usernameX, usernameBaselineY - 11);
+    ctx.strokeText(username, usernameX, usernameBaselineY - 11);
+
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 5;
+    ctx.lineCap = "round";
+
+    ctx.beginPath();
+    ctx.moveTo(dropdownCenterX - dropSize, headerCenterY - dropSize / 2 - 8);
+    ctx.lineTo(dropdownCenterX, headerCenterY + dropSize / 2 - 8);
+    ctx.lineTo(dropdownCenterX + dropSize, headerCenterY - dropSize / 2 - 8);
+    ctx.stroke();
+
+    const menuX = 1000;
+    const menuYStart = headerCenterY - 25;
+
+    ctx.lineWidth = 4;
+    for (let i = 0; i < 3; i++) {
+      ctx.beginPath();
+      ctx.moveTo(menuX, menuYStart + i * 16);
+      ctx.lineTo(menuX + 45, menuYStart + i * 16);
+      ctx.stroke();
+    }
+
+    const profileSize = 160;
+    const profileX = 80;
+    const profileY = 165;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.arc(
+      profileX + profileSize / 2,
+      profileY + profileSize / 2,
+      profileSize / 2,
+      0,
+      Math.PI * 2
+    );
+    ctx.closePath();
+    ctx.clip();
+
+    if (profileImageUrl) {
+      const profileImage = await loadImage(profileImageUrl);
+
+      const imgRatio = profileImage.width / profileImage.height;
+      const frameRatio = 1; // avatar IG selalu kotak
+
+      let srcX = 0,
+        srcY = 0,
+        srcW = profileImage.width,
+        srcH = profileImage.height;
+
+      if (imgRatio > frameRatio) {
+        // gambar lebih lebar → crop kiri kanan
+        srcW = profileImage.height;
+        srcX = (profileImage.width - srcW) / 2;
+      } else {
+        // gambar lebih tinggi → crop atas bawah
+        srcH = profileImage.width;
+        srcY = (profileImage.height - srcH) / 2;
+      }
+
+      ctx.drawImage(
+        profileImage,
+        srcX,
+        srcY,
+        srcW,
+        srcH,
+        profileX,
+        profileY,
+        profileSize,
+        profileSize
+      );
+    } else {
+      ctx.fillStyle = "#262626";
+      ctx.fillRect(profileX, profileY, profileSize, profileSize);
+    }
+    ctx.restore();
+
+    const plusButtonX = profileX + profileSize - 15;
+    const plusButtonY = profileY + profileSize - 15;
+
+    ctx.fillStyle = "#FFFFFF";
+    ctx.beginPath();
+    ctx.arc(plusButtonX, plusButtonY, 25, 0, Math.PI * 2);
+    ctx.fill();
+
+    ctx.strokeStyle = bgColor;
+    ctx.lineWidth = 4;
+    ctx.stroke();
+
+    ctx.strokeStyle = "#000000";
+    ctx.lineWidth = 3.5;
+    ctx.beginPath();
+    ctx.moveTo(plusButtonX - 10, plusButtonY);
+    ctx.lineTo(plusButtonX + 10, plusButtonY);
+    ctx.stroke();
+    ctx.beginPath();
+    ctx.moveTo(plusButtonX, plusButtonY - 10);
+    ctx.lineTo(plusButtonX, plusButtonY + 10);
+    ctx.stroke();
+
+    if (note) {
+      const noteX = 80;
+      const noteY = 140;
+      ctx.font = '22px "SfProDisplay", sans-serif';
+      const noteTextWidth = ctx.measureText(note).width;
+      const notePadding = 20;
+      const noteWidth = noteTextWidth + notePadding * 2;
+      const noteHeight = 42;
+      const noteRadius = 21;
+
+      ctx.fillStyle = "#262626";
+      ctx.beginPath();
+      ctx.moveTo(noteX + noteRadius, noteY);
+      ctx.lineTo(noteX + noteWidth - noteRadius, noteY);
+      ctx.quadraticCurveTo(
+        noteX + noteWidth,
+        noteY,
+        noteX + noteWidth,
+        noteY + noteRadius
+      );
+      ctx.lineTo(noteX + noteWidth, noteY + noteHeight - noteRadius);
+      ctx.quadraticCurveTo(
+        noteX + noteWidth,
+        noteY + noteHeight,
+        noteX + noteWidth - noteRadius,
+        noteY + noteHeight
+      );
+      ctx.lineTo(noteX + noteRadius, noteY + noteHeight);
+      ctx.quadraticCurveTo(
+        noteX,
+        noteY + noteHeight,
+        noteX,
+        noteY + noteHeight - noteRadius
+      );
+      ctx.lineTo(noteX, noteY + noteRadius);
+      ctx.quadraticCurveTo(noteX, noteY, noteX + noteRadius, noteY);
+      ctx.closePath();
+      ctx.fill();
+
+      ctx.fillStyle = secondaryTextColor;
+      ctx.textAlign = "left";
+      ctx.textBaseline = "middle";
+      ctx.fillText(note, noteX + notePadding, noteY + noteHeight / 2);
+    }
+
+    ctx.textAlign = "left";
+    ctx.fillStyle = textColor;
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 1;
+    ctx.font = 'bold 32px "SfProDisplay", sans-serif';
+    const nameX = 330;
+    const nameY = 190;
+    ctx.fillText(displayName, nameX, nameY);
+    ctx.strokeText(displayName, nameX, nameY);
+
+    if (verified) {
+      const textLength = ctx.measureText(displayName).width;
+      const verifiedIcon = await loadImage(
+        path.join(
+          __dirname,
+          "..",
+          "assets",
+          "images",
+          "instagram",
+          "instagram-verified.png"
+        )
+      );
+      const iconSize = 30;
+      const badgeX = nameX + textLength + 15;
+      const badgeY = nameY - iconSize + 15;
+      ctx.drawImage(verifiedIcon, badgeX, badgeY, iconSize, iconSize);
+    }
+
+    const statsY = 265;
+    const statsX1 = 330;
+    const statsX2 = 550;
+    const statsX3 = 800;
+
+    ctx.fillStyle = textColor;
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 1;
+    ctx.font = 'bold 32px "SfProDisplay", sans-serif';
+    ctx.textBaseline = "alphabetic";
+
+    const postsText = formatStatNumber(posts);
+    const followersText = formatStatNumber(followers);
+    const followingText = formatStatNumber(following);
+
+    ctx.fillText(postsText, statsX1, statsY);
+    ctx.strokeText(postsText, statsX1, statsY);
+
+    ctx.fillText(followersText, statsX2, statsY);
+    ctx.strokeText(followersText, statsX2, statsY);
+
+    ctx.fillText(followingText, statsX3, statsY);
+    ctx.strokeText(followingText, statsX3, statsY);
+
+    ctx.font = '24px "SfProDisplay", sans-serif';
+    ctx.fillText("posts", statsX1, statsY + 40);
+    ctx.fillText("followers", statsX2, statsY + 40);
+    ctx.fillText("following", statsX3, statsY + 40);
+
+    let currentY = 430;
+    ctx.fillStyle = textColor;
+    ctx.font = '26px "SfProDisplay", sans-serif';
+    ctx.textAlign = "left";
+
+    bioLines.forEach((line) => {
+      ctx.fillText(line, 35, currentY);
+      currentY += bioLineHeight;
+    });
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat Instagram profile:", error);
+    return null;
+  }
+}
+
+async function generateTiktokProfile(options = {}) {
+  const {
+    username = "w.Iruka",
+    displayName = "w.Iruka イルカ",
+    posts = "1",
+    followers = "399",
+    following = "29",
+    bio = "Nothing special, never stop flying... GET OUT!!!",
+    verified = true,
+    profileImageUrl = null,
+    bgColor = "#000000",
+    textColor = "#FFFFFF",
+    secondaryTextColor = "#626262",
+  } = options;
+
+  try {
+    const canvasWidth = 1080;
+
+    const tempCanvas = createCanvas(canvasWidth, 530);
+    const tempCtx = tempCanvas.getContext("2d");
+    tempCtx.font = '26px "NotoRegular", sans-serif';
+
+    const bioLines = wrapText(tempCtx, bio, 1010);
+    const bioLineHeight = 38;
+    const bioHeight = bioLines.length * bioLineHeight;
+
+    const profileSize = 160;
+    const topBottomPadding = 60;
+
+    const displayNameFontSize = 32;
+    const usernameFontSize = 26;
+    const statsNumberFontSize = 32;
+    const statsLabelFontSize = 24;
+
+    const gapProfileToDisplayName = 25;
+    const gapDisplayNameToUsername = 10;
+    const gapUsernameToStats = 35;
+    const gapStatsToBio = 60;
+    const gapNumberToLabel = 10;
+
+    const statsBlockHeight =
+      statsNumberFontSize + gapNumberToLabel + statsLabelFontSize;
+
+    const contentHeight =
+      profileSize +
+      gapProfileToDisplayName +
+      displayNameFontSize +
+      gapDisplayNameToUsername +
+      usernameFontSize +
+      gapUsernameToStats +
+      statsBlockHeight +
+      gapStatsToBio +
+      bioHeight;
+
+    const canvasHeight = contentHeight + topBottomPadding * 2;
+
+    const canvas = createCanvas(canvasWidth, canvasHeight);
+    const ctx = canvas.getContext("2d");
+
+    ctx.fillStyle = bgColor;
+    ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+
+    const centerX = canvasWidth / 2;
+    let currentY = topBottomPadding;
+
+    const profileX = centerX - profileSize / 2;
+    const profileY = currentY;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.arc(
+      profileX + profileSize / 2,
+      profileY + profileSize / 2,
+      profileSize / 2,
+      0,
+      Math.PI * 2
+    );
+    ctx.closePath();
+    ctx.clip();
+
+    if (profileImageUrl) {
+      const profileImage = await loadImage(profileImageUrl);
+
+      const imgRatio = profileImage.width / profileImage.height;
+      const frameRatio = 1; // avatar selalu kotak
+
+      let srcX = 0,
+        srcY = 0,
+        srcW = profileImage.width,
+        srcH = profileImage.height;
+
+      if (imgRatio > frameRatio) {
+        // gambar lebih lebar → crop kiri kanan
+        srcW = profileImage.height;
+        srcX = (profileImage.width - srcW) / 2;
+      } else {
+        // gambar lebih tinggi → crop atas bawah
+        srcH = profileImage.width;
+        srcY = (profileImage.height - srcH) / 2;
+      }
+
+      ctx.drawImage(
+        profileImage,
+        srcX,
+        srcY,
+        srcW,
+        srcH,
+        profileX,
+        profileY,
+        profileSize,
+        profileSize
+      );
+    } else {
+      ctx.fillStyle = "#262626";
+      ctx.fillRect(profileX, profileY, profileSize, profileSize);
+    }
+    ctx.restore();
+
+    currentY += profileSize + gapProfileToDisplayName;
+
+    ctx.textAlign = "center";
+    ctx.textBaseline = "alphabetic";
+    ctx.fillStyle = textColor;
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 1;
+    ctx.font = `${displayNameFontSize}px "NotoRegular", sans-serif`;
+
+    const nameY = currentY + displayNameFontSize;
+    ctx.fillText(displayName, centerX, nameY);
+    ctx.strokeText(displayName, centerX, nameY);
+
+    currentY = nameY + gapDisplayNameToUsername;
+
+    ctx.strokeStyle = secondaryTextColor;
+    ctx.lineWidth = 1;
+    ctx.font = `${usernameFontSize}px "NotoRegular", sans-serif`;
+    ctx.fillStyle = secondaryTextColor;
+
+    const usernameText = `@${username}`;
+    const usernameTextWidth = ctx.measureText(usernameText).width;
+
+    const usernameY = currentY + usernameFontSize;
+
+    ctx.fillText(usernameText, centerX - 10, usernameY);
+    ctx.strokeText(usernameText, centerX - 10, usernameY);
+
+    if (verified) {
+      const verifiedIcon = await loadImage(
+        path.join(
+          __dirname,
+          "..",
+          "assets",
+          "images",
+          "tiktok",
+          "tiktok-verified.png"
+        )
+      );
+      const iconSize = 20;
+
+      const badgeX = centerX + usernameTextWidth / 2;
+      const badgeY = usernameY - iconSize + 3;
+
+      ctx.drawImage(verifiedIcon, badgeX, badgeY, iconSize, iconSize);
+    }
+
+    currentY = usernameY + gapUsernameToStats;
+
+    ctx.fillStyle = textColor;
+    ctx.strokeStyle = textColor;
+    ctx.lineWidth = 1;
+    ctx.font = `bold ${statsNumberFontSize}px "NotoRegular", sans-serif`;
+
+    const statsNumbersY = currentY + statsNumberFontSize;
+    const statsSpacing = 200;
+
+    const postsX = centerX - statsSpacing;
+    const followersX = centerX;
+    const followingX = centerX + statsSpacing;
+
+    const postsText = formatStatNumber(posts);
+    const followersText = formatStatNumber(followers);
+    const followingText = formatStatNumber(following);
+
+    ctx.fillText(postsText, postsX, statsNumbersY);
+    ctx.strokeText(postsText, postsX, statsNumbersY);
+
+    ctx.fillText(followersText, followersX, statsNumbersY);
+    ctx.strokeText(followersText, followersX, statsNumbersY);
+
+    ctx.fillText(followingText, followingX, statsNumbersY);
+    ctx.strokeText(followingText, followingX, statsNumbersY);
+
+    ctx.fillStyle = secondaryTextColor;
+    ctx.font = `${statsLabelFontSize}px "NotoRegular", sans-serif`;
+    const statsLabelsY = statsNumbersY + gapNumberToLabel + statsLabelFontSize;
+
+    ctx.fillText("Following", postsX, statsLabelsY);
+    ctx.fillText("Followers", followersX, statsLabelsY);
+    ctx.fillText("Likes", followingX, statsLabelsY);
+
+    currentY = statsLabelsY + gapStatsToBio;
+
+    ctx.fillStyle = textColor;
+    ctx.font = '26px "NotoRegular", sans-serif';
+    ctx.textAlign = "center";
+
+    let bioY = currentY;
+    bioLines.forEach((line) => {
+      ctx.fillText(line, centerX, bioY);
+      bioY += bioLineHeight;
+    });
+
+    return canvas.toBuffer("image/png");
+  } catch (error) {
+    console.error("Gagal membuat TikTok profile:", error);
+    return null;
+  }
+}
+
+async function generateTwitterProfile(options = {}) {
+  const {
+    username = "ExynAwA",
+    displayName = "Exyn AwA",
+    bio = "Nothing special, never stop flying...",
+    followers = 0,
+    following = 0,
+    born = "January 1, 2000",
+    joined = "January 2025",
+    verified = false,
+    profileImageUrl = null,
+    bannerImageUrl = null,
+  } = options;
+
+  const width = 1080;
+  const bannerHeight = 300;
+  const paddingX = 60;
+
+  const tempCanvas = createCanvas(width, 10);
+  const tempCtx = tempCanvas.getContext("2d");
+  tempCtx.font = '30px "SfProDisplay", sans-serif';
+
+  const bioLines = wrapText(tempCtx, bio, width - paddingX * 2);
+  const bioHeight = bioLines.length * 40;
+
+  const canvasHeight = bannerHeight + 120 + 260 + bioHeight + 60;
+
+  const canvas = createCanvas(width, canvasHeight);
+  const ctx = canvas.getContext("2d");
+
+  if (bannerImageUrl) {
+    const banner = await loadImage(bannerImageUrl);
+
+    const imgRatio = banner.width / banner.height;
+    const frameRatio = width / bannerHeight;
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = banner.width,
+      srcH = banner.height;
+
+    if (imgRatio > frameRatio) {
+      // banner lebih lebar → crop kiri kanan
+      srcW = banner.height * frameRatio;
+      srcX = (banner.width - srcW) / 2;
+    } else {
+      // banner lebih tinggi → crop atas bawah
+      srcH = banner.width / frameRatio;
+      srcY = (banner.height - srcH) / 2;
+    }
+
+    ctx.drawImage(banner, srcX, srcY, srcW, srcH, 0, 0, width, bannerHeight);
+  } else {
+    ctx.fillStyle = "#1DA1F2";
+    ctx.fillRect(0, 0, width, bannerHeight);
+  }
+
+  ctx.fillStyle = "#000000";
+  ctx.fillRect(0, bannerHeight, width, canvasHeight - bannerHeight);
+
+  const avatarSize = 170;
+  const avatarX = paddingX;
+  const avatarY = bannerHeight - avatarSize / 2;
+  const avatarCenterX = avatarX + avatarSize / 2;
+  const avatarCenterY = avatarY + avatarSize / 2;
+
+  ctx.beginPath();
+  ctx.arc(avatarCenterX, avatarCenterY, avatarSize / 2 + 6, 0, Math.PI * 2);
+  ctx.fillStyle = "#000000";
+  ctx.fill();
+
+  ctx.save();
+  ctx.beginPath();
+  ctx.arc(avatarCenterX, avatarCenterY, avatarSize / 2, 0, Math.PI * 2);
+  ctx.clip();
+
+  if (profileImageUrl) {
+    const avatar = await loadImage(profileImageUrl);
+
+    const imgRatio = avatar.width / avatar.height;
+    const frameRatio = 1; // kotak
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = avatar.width,
+      srcH = avatar.height;
+
+    if (imgRatio > frameRatio) {
+      // lebih lebar → crop kiri kanan
+      srcW = avatar.height;
+      srcX = (avatar.width - srcW) / 2;
+    } else {
+      // lebih tinggi → crop atas bawah
+      srcH = avatar.width;
+      srcY = (avatar.height - srcH) / 2;
+    }
+
+    ctx.drawImage(
+      avatar,
+      srcX,
+      srcY,
+      srcW,
+      srcH,
+      avatarX,
+      avatarY,
+      avatarSize,
+      avatarSize
+    );
+  } else {
+    ctx.fillStyle = "#2F3336";
+    ctx.fillRect(avatarX, avatarY, avatarSize, avatarSize);
+  }
+  ctx.restore();
+
+  let y = avatarY + avatarSize + 60;
+
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1.5;
+  ctx.font = 'bold 42px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#FFFFFF";
+  ctx.fillText(displayName, avatarX, y);
+  ctx.strokeText(displayName, avatarX, y);
+
+  const nameWidth = ctx.measureText(displayName).width;
+
+  if (verified) {
+    const badge = await loadImage(
+      path.join(__dirname, "../assets/images/tweet/twitter-verified.png")
+    );
+    ctx.drawImage(badge, avatarX + nameWidth + 14, y - 32, 32, 32);
+  }
+
+  y += 46;
+  ctx.font = '28px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#8899A6";
+  ctx.fillText("@" + username, avatarX, y);
+
+  y += 44;
+  ctx.font = '26px "SfProDisplay", sans-serif';
+  ctx.fillText(`🎂 Born ${born}`, avatarX, y);
+  ctx.fillText(`📅 Joined ${joined}`, avatarX + 340, y);
+
+  y += 56;
+
+  const followingText = formatStatNumber(following);
+  const followersText = formatStatNumber(followers);
+
+  ctx.textBaseline = "alphabetic";
+
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1;
+  ctx.font = 'bold 30px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#FFFFFF";
+  ctx.fillText(followingText, avatarX, y);
+  ctx.strokeText(followingText, avatarX, y);
+
+  const followingWidth = ctx.measureText(followingText).width;
+
+  ctx.font = '26px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#8899A6";
+  ctx.fillText(" Following", avatarX + followingWidth + 6, y);
+
+  const followingBlockWidth =
+    followingWidth + ctx.measureText(" Following").width;
+
+  const blockGap = 28;
+
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1;
+  ctx.font = 'bold 30px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#FFFFFF";
+  ctx.fillText(followersText, avatarX + followingBlockWidth + blockGap, y);
+  ctx.strokeText(followersText, avatarX + followingBlockWidth + blockGap, y);
+
+  const followersWidth = ctx.measureText(followersText).width;
+
+  ctx.font = '26px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#8899A6";
+  ctx.fillText(
+    " Followers",
+    avatarX + followingBlockWidth + blockGap + followersWidth + 6,
+    y
+  );
+
+  y += 60;
+  ctx.font = '30px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#FFFFFF";
+
+  bioLines.forEach((line) => {
+    ctx.fillText(line, avatarX, y);
+    y += 40;
+  });
+
+  return canvas.toBuffer("image/png");
+}
+
+async function generateYtProfile(options = {}) {
+  const {
+    username = "Miawaug",
+    displayName = "MiawAug",
+    subscribers = 24800000,
+    videos = 4600,
+    bio = "Disini Kita Akan Seru Seruan bermain game PC, Mobile, dan Console Hehe...",
+    verified = true,
+    profileImageUrl = null,
+    bannerImageUrl = null,
+  } = options;
+
+  const width = 1080;
+  const padding = 48;
+
+  const bannerHeight = 320;
+  const bannerRadius = 24;
+
+  const tempCanvas = createCanvas(width, 10);
+  const tempCtx = tempCanvas.getContext("2d");
+  tempCtx.font = '26px "NotoRegular", sans-serif';
+
+  const bioLines = wrapText(tempCtx, bio, width - padding * 2);
+  const bioHeight = bioLines.length * 34;
+
+  const contentHeight =
+    padding + bannerHeight + padding + 180 + 32 + bioHeight + 60;
+
+  const canvas = createCanvas(width, contentHeight);
+  const ctx = canvas.getContext("2d");
+
+  ctx.fillStyle = "#0F0F0F";
+  ctx.fillRect(0, 0, width, contentHeight);
+
+  const bannerX = padding;
+  const bannerY = padding;
+  const bannerW = width - padding * 2;
+
+  ctx.save();
+  ctx.beginPath();
+  ctx.moveTo(bannerX + bannerRadius, bannerY);
+  ctx.lineTo(bannerX + bannerW - bannerRadius, bannerY);
+  ctx.quadraticCurveTo(
+    bannerX + bannerW,
+    bannerY,
+    bannerX + bannerW,
+    bannerY + bannerRadius
+  );
+  ctx.lineTo(bannerX + bannerW, bannerY + bannerHeight - bannerRadius);
+  ctx.quadraticCurveTo(
+    bannerX + bannerW,
+    bannerY + bannerHeight,
+    bannerX + bannerW - bannerRadius,
+    bannerY + bannerHeight
+  );
+  ctx.lineTo(bannerX + bannerRadius, bannerY + bannerHeight);
+  ctx.quadraticCurveTo(
+    bannerX,
+    bannerY + bannerHeight,
+    bannerX,
+    bannerY + bannerHeight - bannerRadius
+  );
+  ctx.lineTo(bannerX, bannerY + bannerRadius);
+  ctx.quadraticCurveTo(bannerX, bannerY, bannerX + bannerRadius, bannerY);
+  ctx.closePath();
+  ctx.clip();
+
+  if (bannerImageUrl) {
+    const banner = await loadImage(bannerImageUrl);
+
+    const imgRatio = banner.width / banner.height;
+    const frameRatio = bannerW / bannerHeight;
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = banner.width,
+      srcH = banner.height;
+
+    if (imgRatio > frameRatio) {
+      // gambar lebih lebar → crop kiri kanan
+      srcW = banner.height * frameRatio;
+      srcX = (banner.width - srcW) / 2;
+    } else {
+      // gambar lebih tinggi → crop atas bawah
+      srcH = banner.width / frameRatio;
+      srcY = (banner.height - srcH) / 2;
+    }
+
+    ctx.drawImage(
+      banner,
+      srcX,
+      srcY,
+      srcW,
+      srcH,
+      bannerX,
+      bannerY,
+      bannerW,
+      bannerHeight
+    );
+  } else {
+    ctx.fillStyle = "#202020";
+    ctx.fillRect(bannerX, bannerY, bannerW, bannerHeight);
+  }
+  ctx.restore();
+
+  let y = bannerY + bannerHeight + padding;
+
+  const avatarSize = 140;
+  const avatarX = padding;
+  const avatarY = y;
+
+  ctx.save();
+  ctx.beginPath();
+  ctx.arc(
+    avatarX + avatarSize / 2,
+    avatarY + avatarSize / 2,
+    avatarSize / 2,
+    0,
+    Math.PI * 2
+  );
+  ctx.clip();
+
+  if (profileImageUrl) {
+    const avatar = await loadImage(profileImageUrl);
+
+    const imgRatio = avatar.width / avatar.height;
+    const frameRatio = 1; // kotak
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = avatar.width,
+      srcH = avatar.height;
+
+    if (imgRatio > frameRatio) {
+      // lebih lebar → crop kiri kanan
+      srcW = avatar.height;
+      srcX = (avatar.width - srcW) / 2;
+    } else {
+      // lebih tinggi → crop atas bawah
+      srcH = avatar.width;
+      srcY = (avatar.height - srcH) / 2;
+    }
+
+    ctx.drawImage(
+      avatar,
+      srcX,
+      srcY,
+      srcW,
+      srcH,
+      avatarX,
+      avatarY,
+      avatarSize,
+      avatarSize
+    );
+  } else {
+    ctx.fillStyle = "#303030";
+    ctx.fillRect(avatarX, avatarY, avatarSize, avatarSize);
+  }
+  ctx.restore();
+
+  const textX = avatarX + avatarSize + 24;
+
+  const nameFont = 32;
+  const smallFont = 22;
+  const lineGap = 10;
+
+  const textBlockHeight = nameFont + lineGap + smallFont + lineGap + smallFont;
+
+  let textY = avatarY + avatarSize / 2 - textBlockHeight / 2 + nameFont;
+
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1.5;
+  ctx.font = `bold ${nameFont}px "NotoRegular", sans-serif`;
+  ctx.fillStyle = "#FFFFFF";
+  ctx.fillText(displayName, textX, textY);
+  ctx.strokeText(displayName, textX, textY);
+
+  const nameWidth = ctx.measureText(displayName).width;
+
+  if (verified) {
+    const badge = await loadImage(
+      path.join(__dirname, "../assets/images/youtube/youtube-verified.png")
+    );
+    ctx.drawImage(badge, textX + nameWidth + 8, textY - 22, 22, 22);
+  }
+
+  textY += nameFont + lineGap;
+  ctx.font = `${smallFont}px "NotoRegular", sans-serif`;
+  ctx.fillStyle = "#FFFFFF";
+  ctx.fillText("@" + username, textX, textY - 10);
+
+  textY += smallFont + lineGap;
+  ctx.fillStyle = "#AAAAAA";
+  ctx.fillText(
+    `${formatStatNumber(subscribers)} subscribers • ${formatStatNumber(
+      videos
+    )} videos`,
+    textX,
+    textY - 10
+  );
+
+  let bioY = avatarY + avatarSize + 40;
+  ctx.font = '26px "NotoRegular", sans-serif';
+  ctx.fillStyle = "#AAAAAA";
+
+  bioLines.forEach((line) => {
+    ctx.fillText(line, padding, bioY);
+    bioY += 34;
+  });
+
+  return canvas.toBuffer("image/png");
+}
+
+async function generateGoogleSearch(options = {}) {
+  const {
+    query = "Contoh Pencarian",
+    description = "Ini adalah teks deskripsi dummy untuk keperluan demo UI Google Search. Konten ini aman dan tidak berasal dari sumber berhak cipta.",
+    imageUrl = null,
+    source = "Demo Source",
+  } = options;
+
+  const width = 956;
+  const height = 1100;
+
+  const canvas = createCanvas(width, height);
+  const ctx = canvas.getContext("2d");
+
+  // ===== BACKGROUND TEMPLATE =====
+  const bg = await loadImage(
+    path.join(__dirname, "../assets/images/google/google-search.jpg")
+  );
+  ctx.drawImage(bg, 0, 0, width, height);
+
+  ctx.fillStyle = "#B0B0B0";
+  ctx.font = 'bold 30px "SfProDisplay", sans-serif';
+  ctx.textAlign = "left";
+  ctx.fillText(query, width / 7 - 5, height / 8 - 15 * 4);
+
+  // ===== QUERY TITLE =====
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1.5;
+  ctx.fillStyle = "#FFFFFF";
+  ctx.font = 'bold 34px "SfProDisplay", sans-serif';
+  ctx.textAlign = "left";
+  ctx.fillText(query, 48, height / 4 + 15);
+  ctx.strokeText(query, 48, height / 4 + 15);
+
+  // ===== IMAGE CARD =====
+  const imgX = 36;
+  const imgY = height / 3 - 25;
+  const imgW = width - 72;
+  const imgH = 460;
+  const radius = 25;
+
+  // 1️⃣ FRAME BACKGROUND
+  ctx.fillStyle = "#1E1E1E";
+  ctx.beginPath();
+  ctx.moveTo(imgX + radius, imgY);
+  ctx.lineTo(imgX + imgW - radius, imgY);
+  ctx.quadraticCurveTo(imgX + imgW, imgY, imgX + imgW, imgY + radius);
+  ctx.lineTo(imgX + imgW, imgY + imgH - radius);
+  ctx.quadraticCurveTo(
+    imgX + imgW,
+    imgY + imgH,
+    imgX + imgW - radius,
+    imgY + imgH
+  );
+  ctx.lineTo(imgX + radius, imgY + imgH);
+  ctx.quadraticCurveTo(imgX, imgY + imgH, imgX, imgY + imgH - radius);
+  ctx.lineTo(imgX, imgY + radius);
+  ctx.quadraticCurveTo(imgX, imgY, imgX + radius, imgY);
+  ctx.closePath();
+  ctx.fill();
+
+  // 2️⃣ CLIP ROUND
+  ctx.save();
+  ctx.beginPath();
+  ctx.moveTo(imgX + radius, imgY);
+  ctx.lineTo(imgX + imgW - radius, imgY);
+  ctx.quadraticCurveTo(imgX + imgW, imgY, imgX + imgW, imgY + radius);
+  ctx.lineTo(imgX + imgW, imgY + imgH - radius);
+  ctx.quadraticCurveTo(
+    imgX + imgW,
+    imgY + imgH,
+    imgX + imgW - radius,
+    imgY + imgH
+  );
+  ctx.lineTo(imgX + radius, imgY + imgH);
+  ctx.quadraticCurveTo(imgX, imgY + imgH, imgX, imgY + imgH - radius);
+  ctx.lineTo(imgX, imgY + radius);
+  ctx.quadraticCurveTo(imgX, imgY, imgX + radius, imgY);
+  ctx.closePath();
+  ctx.clip();
+
+  // 3️⃣ CENTER CROP (OBJECT-FIT: COVER)
+  if (imageUrl) {
+    const img = await loadImage(imageUrl);
+
+    const imgRatio = img.width / img.height;
+    const frameRatio = imgW / imgH;
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = img.width,
+      srcH = img.height;
+
+    if (imgRatio > frameRatio) {
+      // gambar lebih lebar → crop kiri kanan
+      srcW = img.height * frameRatio;
+      srcX = (img.width - srcW) / 2;
+    } else {
+      // gambar lebih tinggi → crop atas bawah
+      srcH = img.width / frameRatio;
+      srcY = (img.height - srcH) / 2;
+    }
+
+    ctx.drawImage(img, srcX, srcY, srcW, srcH, imgX, imgY, imgW, imgH);
+  }
+
+  ctx.restore();
+
+  // ===== IMAGE SOURCE OVERLAY =====
+  ctx.fillStyle = "rgba(0,0,0,0.55)";
+  ctx.fillRect(imgX + 18, imgY + imgH - 44, 260, 32);
+
+  ctx.fillStyle = "#FFFFFF";
+  ctx.font = '20px "SfProDisplay", sans-serif';
+  ctx.fillText(`Sumber: ${source}`, imgX + 28, imgY + imgH - 22);
+
+  // ===== DESCRIPTION =====
+  ctx.font = '26px "SfProDisplay", sans-serif';
+  ctx.fillStyle = "#E0E0E0";
+
+  const textX = 48;
+  const textY = imgY + imgH + 56;
+  const maxWidth = width - 96;
+  const lineHeight = 38;
+
+  let line = "";
+  let y = textY;
+  const words = description.split(" ");
+
+  for (let i = 0; i < words.length; i++) {
+    const testLine = line + words[i] + " ";
+    if (ctx.measureText(testLine).width > maxWidth) {
+      ctx.fillText(line, textX, y);
+      line = words[i] + " ";
+      y += lineHeight;
+    } else {
+      line = testLine;
+    }
+  }
+  ctx.fillText(line, textX, y);
+
+  return canvas.toBuffer("image/png");
+}
+
+async function generateGoogleLyrics(options = {}) {
+  const {
+    song = "Langkah Kecil",
+    artist = "Demo Artist",
+    lyrics = [
+      "Ini hanya contoh lirik",
+      "Bukan lagu yang sebenarnya",
+      "Digunakan untuk demo UI",
+      "Agar aman dari hak cipta",
+      "Setiap baris hanya placeholder",
+      "Bebas dipakai kapan saja",
+      "",
+      "Ini hanya contoh lirik",
+      "Bukan lagu yang sebenarnya",
+    ],
+    years = "2009",
+    thumbnail = null,
+  } = options;
+
+  const canvasWidth = 1080;
+  const canvasHeight = 981;
+  const canvas = createCanvas(canvasWidth, canvasHeight);
+  const ctx = canvas.getContext("2d");
+
+  // ===== BACKGROUND =====
+  const backgroundImage = await loadImage(
+    path.join(__dirname, "../assets/images/google/google-lyrics.jpg")
+  );
+  ctx.drawImage(backgroundImage, 0, 0, canvasWidth, canvasHeight);
+
+  ctx.fillStyle = "#B0B0B0";
+  ctx.font = 'bold 30px "SfProDisplay", sans-serif';
+  ctx.textAlign = "left";
+  ctx.fillText(song, canvasWidth / 7 - 6, canvasHeight / 8 - 40);
+
+  // ===== TITLE =====
+  ctx.strokeStyle = "#FFFFFF";
+  ctx.lineWidth = 1.5;
+  ctx.fillStyle = "#FFFFFF";
+  ctx.font = 'bold 40px "SfProDisplay", sans-serif';
+  ctx.textAlign = "left";
+  ctx.fillText(song, canvasWidth / 10 - 10 * 5, canvasHeight / 8 + 100 * 2);
+  ctx.strokeText(song, canvasWidth / 10 - 10 * 5, canvasHeight / 8 + 100 * 2);
+
+  // ===== ARTIST =====
+  ctx.fillStyle = "#B0B0B0";
+  ctx.font = '26px "SfProDisplay", sans-serif';
+  ctx.fillText(
+    `${artist} • ${years}`,
+    canvasWidth / 10 - 10 * 5,
+    canvasHeight / 8 + 80 * 3
+  );
+
+  // ===== LYRICS PREVIEW =====
+  ctx.textAlign = "left";
+  ctx.fillStyle = "#B0B0B0";
+  ctx.font = '28px "SfProDisplay", sans-serif';
+
+  let startY = canvasHeight / 8 + 108 * 4;
+  let y = startY;
+  const lineHeight = 42;
+  const maxWidth = canvasWidth - (canvasWidth / 10 - 10 * 5) - 64;
+
+  // OPTIONAL: limit total rendered lines (aman)
+  const maxRenderedLines = 12;
+  let renderedLines = 0;
+
+  for (const line of lyrics) {
+    if (renderedLines >= maxRenderedLines) break;
+
+    const prevY = y;
+    y = drawWrappedText(
+      ctx,
+      line,
+      canvasWidth / 10 - 10 * 5,
+      y,
+      maxWidth,
+      lineHeight
+    );
+
+    // hitung berapa baris yang dipakai
+    renderedLines += Math.round((y - prevY) / lineHeight);
+  }
+
+  // ===== THUMBNAIL (RECTANGLE + ROUNDED, INLINE) =====
+  // ===== THUMBNAIL (RECTANGLE + ROUNDED + CENTER CROP) =====
+  if (thumbnail) {
+    const thumb = await loadImage(thumbnail);
+
+    const thumbWidth = 185;
+    const thumbHeight = 129;
+    const radius = 16;
+
+    const x = canvasWidth - thumbWidth - 25;
+    const yThumb = canvasHeight / 8 + 100 * 2 - 51;
+
+    // === hitung center crop ===
+    const imgRatio = thumb.width / thumb.height;
+    const frameRatio = thumbWidth / thumbHeight;
+
+    let srcX = 0,
+      srcY = 0,
+      srcW = thumb.width,
+      srcH = thumb.height;
+
+    if (imgRatio > frameRatio) {
+      // gambar lebih lebar → crop kiri kanan
+      srcW = thumb.height * frameRatio;
+      srcX = (thumb.width - srcW) / 2;
+    } else {
+      // gambar lebih tinggi → crop atas bawah
+      srcH = thumb.width / frameRatio;
+      srcY = (thumb.height - srcH) / 2;
+    }
+
+    ctx.save();
+    ctx.beginPath();
+
+    ctx.moveTo(x + radius, yThumb);
+    ctx.lineTo(x + thumbWidth - radius, yThumb);
+    ctx.quadraticCurveTo(
+      x + thumbWidth,
+      yThumb,
+      x + thumbWidth,
+      yThumb + radius
+    );
+
+    ctx.lineTo(x + thumbWidth, yThumb + thumbHeight - radius);
+    ctx.quadraticCurveTo(
+      x + thumbWidth,
+      yThumb + thumbHeight,
+      x + thumbWidth - radius,
+      yThumb + thumbHeight
+    );
+
+    ctx.lineTo(x + radius, yThumb + thumbHeight);
+    ctx.quadraticCurveTo(
+      x,
+      yThumb + thumbHeight,
+      x,
+      yThumb + thumbHeight - radius
+    );
+
+    ctx.lineTo(x, yThumb + radius);
+    ctx.quadraticCurveTo(x, yThumb, x + radius, yThumb);
+
+    ctx.closePath();
+    ctx.clip();
+
+    ctx.drawImage(
+      thumb,
+      srcX,
+      srcY,
+      srcW,
+      srcH,
+      x,
+      yThumb,
+      thumbWidth,
+      thumbHeight
+    );
+
+    ctx.restore();
+  }
+
+  return canvas.toBuffer("image/png");
+}
+
+async function generateMeme(baseImagePath, topText, bottomText, options = {}) {
+  let img = await loadImage(baseImagePath);
+  let targetWidth = img.width;
+  let targetHeight = img.height;
+  if (options.square) {
+    const size = Math.min(img.width, img.height);
+    const offsetX = (img.width - size) / 2;
+    const offsetY = (img.height - size) / 2;
+    const squareCanvas = createCanvas(size, size);
+    const squareCtx = squareCanvas.getContext("2d");
+    squareCtx.drawImage(img, offsetX, offsetY, size, size, 0, 0, size, size);
+    img = await loadImage(squareCanvas.toBuffer());
+    targetWidth = targetHeight = size;
+  }
+  const canvas = createCanvas(targetWidth, targetHeight);
+  const ctx = canvas.getContext("2d");
+  ctx.drawImage(img, 0, 0, targetWidth, targetHeight);
+  const fontSize = options.fontSize || 65;
+  const maxWidth = canvas.width - 20;
+  const allEmojiImages = await emojiImageByBrandPromise;
+  const emojiCache = allEmojiImages["apple"] || {};
+  async function renderTextWithEmoji(text, y, fromBottom = false) {
+    const segments = parseTextToSegments(text, ctx, fontSize);
+    const lines = rebuildLinesFromSegments(segments, maxWidth, ctx, fontSize);
+    const lineHeight = fontSize + 5;
+    let totalHeight = lines.length * lineHeight;
+    let currentY;
+    if (fromBottom) {
+      currentY = canvas.height - y - totalHeight + fontSize;
+    } else {
+      currentY = y;
+    }
+    for (const line of lines) {
+      let currentX = (canvas.width - line.reduce((a, s) => a + s.width, 0)) / 2;
+      for (const segment of line) {
+        if (segment.type === "emoji") {
+          const base64 = emojiCache[segment.content];
+          if (base64) {
+            const emojiImg = await loadImage(Buffer.from(base64, "base64"));
+            const emojiYOffset = fontSize * 0.75;
+            ctx.drawImage(
+              emojiImg,
+              currentX,
+              currentY - emojiYOffset,
+              fontSize,
+              fontSize
+            );
+          } else {
+            ctx.fillStyle = "white";
+            ctx.fillText(segment.content, currentX, currentY);
+          }
+        } else {
+          ctx.font = `${fontSize}px "SfProDisplay"`;
+          ctx.fillStyle = "white";
+          ctx.strokeStyle = "black";
+          ctx.lineWidth = 4;
+          ctx.strokeText(segment.content, currentX, currentY);
+          ctx.fillText(segment.content, currentX, currentY);
+        }
+        currentX += segment.width;
+      }
+      currentY += lineHeight;
+    }
+  }
+  await renderTextWithEmoji(
+    topText,
+    options.topPadding || fontSize + 40,
+    false
+  );
+  await renderTextWithEmoji(bottomText, options.bottomPadding || 50, true);
+  return canvas.toBuffer();
+}
+async function generateQuote(baseImagePath, text, options = {}) {
+  const img = await loadImage(baseImagePath);
+  const canvas = createCanvas(img.width, img.height);
+  const ctx = canvas.getContext("2d");
+  ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
+  const fontSize = options.fontSize || 42;
+  const startX = options.startX || 80;
+  const maxWidth = options.maxWidth || canvas.width * 0.7;
+  const lineSpacing = options.lineSpacing || Math.floor(fontSize * 0.5);
+  const gap = options.gap || Math.floor(fontSize * 0.5);
+  ctx.font = `bold ${fontSize}px Arial`;
+  function wrapText(text) {
+    const words = text.split(" ");
+    let lines = [];
+    let currentLine = words[0];
+    for (let i = 1; i < words.length; i++) {
+      const word = words[i];
+      const width = ctx.measureText(currentLine + " " + word).width;
+      if (width < maxWidth) {
+        currentLine += " " + word;
+      } else {
+        lines.push(currentLine);
+        currentLine = word;
+      }
+    }
+    lines.push(currentLine);
+    return lines;
+  }
+  const lines = wrapText(text);
+  let y = canvas.height * 0.5 - canvas.height * 0.15;
+  const quoteFontSize = Math.floor(fontSize * 1.4);
+  const boxSize = quoteFontSize * 0.8;
+  ctx.fillStyle = "#00B894";
+  ctx.fillRect(startX, y - fontSize - boxSize - gap, boxSize, boxSize);
+  ctx.fillStyle = "white";
+  ctx.font = `bold ${quoteFontSize}px Arial`;
+  ctx.textBaseline = "middle";
+  ctx.textAlign = "center";
+  ctx.fillText("❝", startX + boxSize / 2, y - fontSize - boxSize / 2);
+  ctx.font = `bold ${fontSize}px Arial`;
+  ctx.textBaseline = "alphabetic";
+  ctx.textAlign = "left";
+  for (const line of lines) {
+    const lineWidth = ctx.measureText(line).width;
+    const paddingX = Math.floor(fontSize * 0.5);
+    const paddingY = Math.floor(fontSize * 0.25);
+    ctx.fillStyle = "white";
+    ctx.fillRect(
+      startX - paddingX / 2,
+      y - fontSize,
+      lineWidth + paddingX,
+      fontSize + paddingY
+    );
+    ctx.fillStyle = "black";
+    ctx.fillText(line, startX, y);
+    y += fontSize + lineSpacing;
+  }
+  return canvas.toBuffer();
+}
+function generateAnimatedBratVid(tempFrameDir, outputPath) {
+  return new Promise((resolve, reject) => {
+    try {
+      if (typeof tempFrameDir !== "string" || typeof outputPath !== "string")
+        throw new TypeError("Directory and path must be strings");
+      if (!fs.existsSync(tempFrameDir))
+        throw new Error(`Temporary frame directory not found: ${tempFrameDir}`);
+      ffmpeg()
+        .input(path.join(tempFrameDir, "frame_%d.png"))
+        .inputOptions("-framerate", "1.5")
+        .outputOptions(
+          "-vf",
+          "scale=512:512:force_original_aspect_ratio=decrease,pad=512:512:(ow-iw)/2:(oh-ih)/2"
+        )
+        .output(outputPath)
+        .videoCodec("libwebp")
+        .outputOptions("-loop", "0", "-q:v", "80", "-preset", "default", "-an")
+        .on("end", resolve)
+        .on("error", reject)
+        .run();
+    } catch (error) {
+      reject(error);
+    }
+  });
+}
+
+async function bratVidGenerator(
+  text,
+  width,
+  height,
+  bgColor = "#FFFFFF",
+  textColor = "#000000",
+  highlightWords = []
+) {
+  try {
+    if (typeof text !== "string" || text.trim().length === 0)
+      throw new Error("Text must be a non-empty string");
+    if (!Array.isArray(highlightWords))
+      throw new TypeError("highlightWords must be an array.");
+    if (
+      !Number.isInteger(width) ||
+      !Number.isInteger(height) ||
+      width <= 0 ||
+      height <= 0
+    )
+      throw new Error("Width and height must be positive integers");
+    if (!/^#[0-9A-F]{6}$/i.test(bgColor) || !/^#[0-9A-F]{6}$/i.test(textColor))
+      throw new Error("Colors must be in hex format (#RRGGBB)");
+    const allEmojiImages = await emojiImageByBrandPromise;
+    const emojiCache = allEmojiImages["apple"] || {};
+    const padding = 20;
+    const availableWidth = width - padding * 2;
+    const tempCanvas = createCanvas(1, 1);
+    const tempCtx = tempCanvas.getContext("2d");
+    if (!tempCtx) throw new Error("Failed to create canvas context");
+    const tokens = text.match(/\S+|\n/g) || [];
+    if (tokens.length === 0)
+      throw new Error("No valid content tokens found in the text");
+    let frames = [];
+    const recalculateSegmentWidths = (segments, fontSize, ctx) => {
+      return segments.map((seg) => {
+        let newWidth = seg.width;
+        switch (seg.type) {
+          case "bold":
+            ctx.font = `bold ${fontSize}px Arial`;
+            newWidth = ctx.measureText(seg.content).width;
+            break;
+          case "italic":
+            ctx.font = `italic ${fontSize}px Arial`;
+            newWidth = ctx.measureText(seg.content).width;
+            break;
+          case "bolditalic":
+            ctx.font = `bold italic ${fontSize}px Arial`;
+            newWidth = ctx.measureText(seg.content).width;
+            break;
+          case "monospace":
+            ctx.font = `${fontSize}px 'Courier New', monospace`;
+            newWidth = ctx.measureText(seg.content).width;
+            break;
+          case "strikethrough":
+          case "text":
+            ctx.font = `${fontSize}px Arial`;
+            newWidth = ctx.measureText(seg.content).width;
+            break;
+          case "emoji":
+            newWidth = fontSize * 1.2;
+            break;
+        }
+        return { ...seg, width: newWidth };
+      });
+    };
+    const renderSegment = async (ctx, segment, x, y, fontSize, lineHeight) => {
+      ctx.fillStyle = highlightWords.includes(segment.content)
+        ? "red"
+        : textColor;
+      switch (segment.type) {
+        case "bold":
+          ctx.font = `bold ${fontSize}px Arial`;
+          break;
+        case "italic":
+          ctx.font = `italic ${fontSize}px Arial`;
+          break;
+        case "bolditalic":
+          ctx.font = `bold italic ${fontSize}px Arial`;
+          break;
+        case "monospace":
+          ctx.font = `${fontSize}px 'Courier New', monospace`;
+          break;
+        default:
+          ctx.font = `${fontSize}px Arial`;
+          break;
+      }
+      if (segment.type === "emoji") {
+        const emojiSize = fontSize * 1.2;
+        const emojiY = y + (lineHeight - emojiSize) / 2;
+        if (!emojiCache[segment.content])
+          throw new Error(`Emoji ${segment.content} tidak ditemukan`);
+        const emojiImg = await loadImage(
+          Buffer.from(emojiCache[segment.content], "base64")
+        );
+        ctx.drawImage(emojiImg, x, emojiY, emojiSize, emojiSize);
+      } else {
+        ctx.fillText(segment.content, x, y);
+        if (segment.type === "strikethrough") {
+          ctx.strokeStyle = ctx.fillStyle;
+          ctx.lineWidth = Math.max(1, fontSize / 15);
+          const lineY = y + lineHeight / 2.1;
+          ctx.beginPath();
+          ctx.moveTo(x, lineY);
+          ctx.lineTo(x + segment.width, lineY);
+          ctx.stroke();
+        }
+      }
+    };
+    for (let i = 1; i <= tokens.length; i++) {
+      const frameTokens = tokens.slice(0, i);
+      const currentText = frameTokens
+        .join(" ")
+        .replace(/ \n /g, "\n")
+        .replace(/\n /g, "\n")
+        .replace(/ \n/g, "\n");
+      if (currentText.trim() === "") continue;
+      let fontSize = 200;
+      let finalLines = [];
+      let lineHeight = 0;
+      const lineHeightMultiplier = 1.3;
+      while (fontSize > 10) {
+        let currentRenderLines = [];
+        const textLines = currentText.split("\n");
+        for (const singleLineText of textLines) {
+          if (singleLineText === "") {
+            currentRenderLines.push([]);
+            continue;
+          }
+          let segments = parseTextToSegments(singleLineText, tempCtx, fontSize);
+          let segmentsForSizing = recalculateSegmentWidths(
+            segments,
+            fontSize,
+            tempCtx
+          );
+          let wrappedLines = rebuildLinesFromSegments(
+            segmentsForSizing,
+            availableWidth,
+            tempCtx,
+            fontSize
+          );
+          currentRenderLines.push(...wrappedLines);
+        }
+        const currentLineHeight = fontSize * lineHeightMultiplier;
+        const totalTextHeight = currentRenderLines.length * currentLineHeight;
+        if (totalTextHeight <= height - padding * 2) {
+          finalLines = currentRenderLines;
+          lineHeight = currentLineHeight;
+          break;
+        }
+        fontSize -= 2;
+      }
+      const canvas = createCanvas(width, height);
+      const ctx = canvas.getContext("2d");
+      if (!ctx) throw new Error("Failed to create canvas context");
+      ctx.fillStyle = bgColor;
+      ctx.fillRect(0, 0, width, height);
+      ctx.textBaseline = "top";
+      const totalTextBlockHeight = finalLines.length * lineHeight;
+      const startY = (height - totalTextBlockHeight) / 2;
+      for (let j = 0; j < finalLines.length; j++) {
+        const line = finalLines[j];
+        const positionY = startY + j * lineHeight;
+        const contentSegments = line.filter((seg) => seg.type !== "whitespace");
+        if (contentSegments.length <= 1) {
+          let positionX = padding;
+          for (const segment of line) {
+            await renderSegment(
+              ctx,
+              segment,
+              positionX,
+              positionY,
+              fontSize,
+              lineHeight
+            );
+            positionX += segment.width;
+          }
+        } else {
+          const totalContentWidth = contentSegments.reduce(
+            (sum, seg) => sum + seg.width,
+            0
+          );
+          const spaceBetween =
+            (availableWidth - totalContentWidth) / (contentSegments.length - 1);
+          let positionX = padding;
+          for (let k = 0; k < contentSegments.length; k++) {
+            const segment = contentSegments[k];
+            await renderSegment(
+              ctx,
+              segment,
+              positionX,
+              positionY,
+              fontSize,
+              lineHeight
+            );
+            positionX += segment.width;
+            if (k < contentSegments.length - 1) {
+              positionX += spaceBetween;
+            }
+          }
+        }
+      }
+      const buffer = canvas.toBuffer("image/png");
+      const blurredBuffer = await sharp(buffer).blur(3).toBuffer();
+      frames.push(blurredBuffer);
+    }
+    return frames;
+  } catch (error) {
+    throw error;
+  }
+}
+async function bratGenerator(teks, highlightWords = []) {
+  try {
+    if (typeof teks !== "string" || teks.trim().length === 0)
+      throw new Error("Teks tidak boleh kosong.");
+    if (!Array.isArray(highlightWords))
+      throw new TypeError("highlightWords harus berupa array.");
+    const allEmojiImages = await emojiImageByBrandPromise;
+    const emojiCache = allEmojiImages["apple"] || {};
+    let width = 512,
+      height = 512,
+      margin = 8,
+      verticalPadding = 8;
+    const canvas = createCanvas(width, height);
+    const ctx = canvas.getContext("2d");
+    if (!ctx) throw new Error("Gagal membuat konteks kanvas.");
+    ctx.fillStyle = "white";
+    ctx.fillRect(0, 0, width, height);
+    ctx.textAlign = "left";
+    ctx.textBaseline = "top";
+    let fontSize = 200;
+    let lineHeightMultiplier = 1.3;
+    const availableWidth = width - 2 * margin;
+    let finalLines = [];
+    let finalFontSize = 0;
+    let lineHeight = 0;
+    const wordCount = (
+      teks.trim().match(/(\p{L}|\p{N}|\p{Emoji_Presentation})+/gu) || []
+    ).length;
+    let lastKnownGoodSolution = null;
+    while (fontSize > 10) {
+      let currentRenderLines = [];
+      const textLines = teks.split("\n");
+      for (const singleLineText of textLines) {
+        if (singleLineText === "") {
+          currentRenderLines.push([]);
+          continue;
+        }
+        let segments = parseTextToSegments(singleLineText, ctx, fontSize);
+        let wrappedLines = rebuildLinesFromSegments(
+          segments,
+          availableWidth,
+          ctx,
+          fontSize
+        );
+        currentRenderLines.push(...wrappedLines);
+      }
+      if (
+        currentRenderLines.length === 1 &&
+        currentRenderLines[0].filter((seg) => seg.type !== "whitespace")
+          .length === 2 &&
+        currentRenderLines[0].some((seg) => seg.type === "text") &&
+        currentRenderLines[0].some((seg) => seg.type === "emoji")
+      ) {
+        const textSeg = currentRenderLines[0].find(
+          (seg) => seg.type === "text"
+        );
+        const emojiSeg = currentRenderLines[0].find(
+          (seg) => seg.type === "emoji"
+        );
+        currentRenderLines = [[textSeg], [emojiSeg]];
+      }
+      const currentLineHeight = fontSize * lineHeightMultiplier;
+      const totalTextHeight = currentRenderLines.length * currentLineHeight;
+      if (totalTextHeight <= height - 2 * verticalPadding) {
+        lastKnownGoodSolution = {
+          lines: currentRenderLines,
+          fontSize: fontSize,
+          lineHeight: currentLineHeight,
+        };
+        if (wordCount === 4) {
+          if (currentRenderLines.length === 2) {
+            finalLines = currentRenderLines;
+            finalFontSize = fontSize;
+            lineHeight = currentLineHeight;
+            break;
+          }
+        } else {
+          finalLines = currentRenderLines;
+          finalFontSize = fontSize;
+          lineHeight = currentLineHeight;
+          break;
+        }
+      }
+      fontSize -= 2;
+    }
+    if (finalLines.length === 0 && lastKnownGoodSolution) {
+      finalLines = lastKnownGoodSolution.lines;
+      finalFontSize = lastKnownGoodSolution.fontSize;
+      lineHeight = lastKnownGoodSolution.lineHeight;
+    }
+    if (
+      finalLines.length === 1 &&
+      finalLines[0].length === 1 &&
+      finalLines[0][0].type === "text"
+    ) {
+      const theOnlyWord = finalLines[0][0].content;
+      const heightBasedSize =
+        (height - 2 * verticalPadding) / lineHeightMultiplier;
+      ctx.font = `200px Arial`;
+      const referenceWidth = ctx.measureText(theOnlyWord).width;
+      const widthBasedSize = (availableWidth / referenceWidth) * 200;
+      finalFontSize = Math.floor(Math.min(heightBasedSize, widthBasedSize));
+      lineHeight = finalFontSize * lineHeightMultiplier;
+    }
+    const totalFinalHeight = finalLines.length * lineHeight;
+    let y =
+      finalLines.length === 1
+        ? verticalPadding
+        : (height - totalFinalHeight) / 2;
+    const renderSegment = async (segment, x, y) => {
+      ctx.fillStyle = isHighlighted(highlightWords, segment.content)
+        ? "red"
+        : "black";
+      switch (segment.type) {
+        case "bold":
+          ctx.font = `bold ${finalFontSize}px Arial`;
+          break;
+        case "italic":
+          ctx.font = `italic ${finalFontSize}px Arial`;
+          break;
+        case "bolditalic":
+          ctx.font = `bold italic ${finalFontSize}px Arial`;
+          break;
+        case "monospace":
+          ctx.font = `${finalFontSize}px 'Courier New', monospace`;
+          break;
+        case "strikethrough":
+        case "text":
+        default:
+          ctx.font = `${finalFontSize}px Arial`;
+          break;
+      }
+      if (segment.type === "emoji") {
+        const emojiSize = finalFontSize * 1.2;
+        const emojiY = y + (lineHeight - emojiSize) / 2;
+        if (!emojiCache[segment.content])
+          throw new Error(`Emoji ${segment.content} tidak ditemukan di cache`);
+        const emojiImg = await loadImage(
+          Buffer.from(emojiCache[segment.content], "base64")
+        );
+        ctx.drawImage(emojiImg, x, emojiY, emojiSize, emojiSize);
+      } else {
+        ctx.fillText(segment.content, x, y);
+        if (segment.type === "strikethrough") {
+          ctx.strokeStyle = ctx.fillStyle;
+          ctx.lineWidth = Math.max(1, finalFontSize / 15);
+          const lineY = y + lineHeight / 2.1;
+          ctx.beginPath();
+          ctx.moveTo(x, lineY);
+          ctx.lineTo(x + segment.width, lineY);
+          ctx.stroke();
+        }
+      }
+    };
+    for (const line of finalLines) {
+      const contentSegments = line.filter((seg) => seg.type !== "whitespace");
+      if (contentSegments.length <= 1) {
+        let x = margin;
+        for (const segment of line) {
+          await renderSegment(segment, x, y);
+          x += segment.width;
+        }
+      } else {
+        const totalContentWidth = contentSegments.reduce(
+          (sum, seg) => sum + seg.width,
+          0
+        );
+        const spacePerGap =
+          (availableWidth - totalContentWidth) / (contentSegments.length - 1);
+        let currentX = margin;
+        for (let i = 0; i < contentSegments.length; i++) {
+          const segment = contentSegments[i];
+          await renderSegment(segment, currentX, y);
+          currentX += segment.width;
+          if (i < contentSegments.length - 1) {
+            currentX += spacePerGap;
+          }
+        }
+      }
+      y += lineHeight;
+    }
+    const buffer = canvas.toBuffer("image/png");
+    const blurredBuffer = await sharp(buffer).blur(3).toBuffer();
+    return blurredBuffer;
+  } catch (error) {
+    console.error("Terjadi error di bratGenerator:", error);
+    throw error;
+  }
+}
+
+module.exports = {
+  generateQuote,
+  generateMeme,
+  generateFakeStory,
+  generateFakeTweet,
+  generateFakeCallAndroid,
+  generateFakeCallIphone,
+  generateFakeChatIphone,
+  generateInstagramProfile,
+  generateTiktokProfile,
+  generateTwitterProfile,
+  generateYtProfile,
+  generateGoogleSearch,
+  generateGoogleLyrics,
+  bratGenerator,
+  bratVidGenerator,
+  generateAnimatedBratVid,
+};