Fix warnings

common/feature-flags.ts

@@ -4,6 +4,6 @@ type FeatureFlags = {
 };
 
 export const featureFlags: FeatureFlags = {
-  APP_STORE_BUILD: true,
+  APP_STORE_BUILD: false,
   SHOW_UPSCAYL_CLOUD_INFO: false,
 };

common/types/types.d.ts

@@ -6,7 +6,7 @@ export type ImageUpscaylPayload = {
   gpuId: string;
   saveImageAs: string;
   overwrite: boolean;
-  compression: number;
+  compression: string;
   noImageProcessing: boolean;
 };
 
@@ -17,7 +17,7 @@ export type DoubleUpscaylPayload = {
   scale: string;
   gpuId: string;
   saveImageAs: string;
-  compression: number;
+  compression: string;
   noImageProcessing: boolean;
 };
 
@@ -28,6 +28,6 @@ export type BatchUpscaylPayload = {
   gpuId: string;
   saveImageAs: string;
   scale: string;
-  compression: number;
+  compression: string;
   noImageProcessing: boolean;
 };

electron/commands/batch-upscayl.ts

@@ -6,6 +6,7 @@ import {
   noImageProcessing,
   outputFolderPath,
   saveOutputFolder,
+  setCompression,
   setNoImageProcessing,
   setStopped,
   stopped,
@@ -39,6 +40,7 @@ const batchUpscayl = async (event, payload: BatchUpscaylPayload) => {
   }
 
   setNoImageProcessing(payload.noImageProcessing);
+  setCompression(parseInt(payload.compression));
 
   const isDefaultModel = DEFAULT_MODELS.includes(model);
 

electron/commands/custom-models-select.ts

@@ -9,6 +9,7 @@ import COMMAND from "../constants/commands";
 import getModels from "../utils/get-models";
 import { getMainWindow } from "../main-window";
 import settings from "electron-settings";
+import { featureFlags } from "../../common/feature-flags";
 
 const customModelsSelect = async (event, message) => {
   const mainWindow = getMainWindow();
@@ -26,7 +27,7 @@ const customModelsSelect = async (event, message) => {
     message: "Select Custom Models Folder that is named 'models'",
   });
 
-  if (bookmarks && bookmarks.length > 0) {
+  if (featureFlags.APP_STORE_BUILD && bookmarks && bookmarks.length > 0) {
     console.log("🚨 Setting Bookmark: ", bookmarks);
     await settings.set("custom-models-bookmarks", bookmarks[0]);
   }

electron/commands/double-upscayl.ts

@@ -6,6 +6,7 @@ import {
   noImageProcessing,
   outputFolderPath,
   saveOutputFolder,
+  setCompression,
   setNoImageProcessing,
   setStopped,
   stopped,
@@ -39,6 +40,7 @@ const doubleUpscayl = async (event, payload: DoubleUpscaylPayload) => {
   const saveImageAs = payload.saveImageAs as string;
 
   setNoImageProcessing(payload.noImageProcessing);
+  setCompression(parseInt(payload.compression));
 
   const isDefaultModel = DEFAULT_MODELS.includes(model);
 

electron/commands/image-upscayl.ts

@@ -10,6 +10,7 @@ import {
   overwrite,
   saveOutputFolder,
   setChildProcesses,
+  setCompression,
   setNoImageProcessing,
   setOverwrite,
   setStopped,
@@ -35,6 +36,7 @@ const imageUpscayl = async (event, payload: ImageUpscaylPayload) => {
 
   setOverwrite(payload.overwrite);
   setNoImageProcessing(payload.noImageProcessing);
+  setCompression(parseInt(payload.compression));
 
   const model = payload.model as string;
   const gpuId = payload.gpuId as string;

electron/commands/select-file.ts

@@ -3,6 +3,7 @@ import { getMainWindow } from "../main-window";
 import { imagePath, setImagePath } from "../utils/config-variables";
 import logit from "../utils/logit";
 import settings from "electron-settings";
+import { featureFlags } from "../../common/feature-flags";
 
 const selectFile = async () => {
   const mainWindow = getMainWindow();
@@ -30,7 +31,7 @@ const selectFile = async () => {
     ],
   });
 
-  if (bookmarks && bookmarks.length > 0) {
+  if (featureFlags.APP_STORE_BUILD && bookmarks && bookmarks.length > 0) {
     console.log("🚨 Setting Bookmark: ", bookmarks);
     settings.set("file-bookmarks", bookmarks[0]);
   }

electron/commands/select-folder.ts

@@ -2,11 +2,12 @@ import { app, dialog } from "electron";
 import { folderPath, setFolderPath } from "../utils/config-variables";
 import logit from "../utils/logit";
 import settings from "electron-settings";
+import { featureFlags } from "../../common/feature-flags";
 
 const selectFolder = async (event, message) => {
   let closeAccess;
   const folderBookmarks = await settings.get("folder-bookmarks");
-  if (folderBookmarks) {
+  if (featureFlags.APP_STORE_BUILD && folderBookmarks) {
     logit("🚨 Folder Bookmarks: ", folderBookmarks);
     try {
       closeAccess = app.startAccessingSecurityScopedResource(
@@ -27,7 +28,7 @@ const selectFolder = async (event, message) => {
     securityScopedBookmarks: true,
   });
 
-  if (bookmarks && bookmarks.length > 0) {
+  if (featureFlags.APP_STORE_BUILD && bookmarks && bookmarks.length > 0) {
     console.log("🚨 Setting folder Bookmark: ", bookmarks);
     await settings.set("folder-bookmarks", bookmarks[0]);
   }

electron/index.ts

@@ -47,7 +47,7 @@ app.on("ready", async () => {
 
   let closeAccess;
   const folderBookmarks = await settings.get("folder-bookmarks");
-  if (folderBookmarks) {
+  if (featureFlags.APP_STORE_BUILD && folderBookmarks) {
     logit("🚨 Folder Bookmarks: ", folderBookmarks);
     try {
       closeAccess = app.startAccessingSecurityScopedResource(

electron/utils/convert-and-scale.ts

@@ -66,9 +66,16 @@ const convertAndScale = async (
           quality: 100 - (compression === 100 ? 99 : compression),
           chromaSubsampling: "4:4:4",
         }),
-        ...(saveImageAs === "png" && {
-          compressionLevel,
-        }),
+        // For PNGs, compression enables indexed colors automatically,
+        // so we need to warn the user that this will happen
+        // https://sharp.pixelplumbing.com/api-output#png
+        ...(saveImageAs === "png" &&
+          compression > 0 && {
+            ...(compression > 0 && {
+              quality: 100 - (compression === 100 ? 99 : compression),
+            }),
+            compressionLevel: 9,
+          }),
         force: true,
       })
       .withMetadata({

electron/utils/get-models.ts

@@ -2,6 +2,7 @@ import fs from "fs";
 import logit from "./logit";
 import { MessageBoxOptions, app, dialog } from "electron";
 import settings from "electron-settings";
+import { featureFlags } from "../../common/feature-flags";
 
 const getModels = async (folderPath: string | undefined) => {
   let models: string[] = [];
@@ -10,7 +11,7 @@ const getModels = async (folderPath: string | undefined) => {
   // SECURITY SCOPED BOOKMARKS
   let closeAccess;
   const customModelsBookmarks = await settings.get("custom-models-bookmarks");
-  if (customModelsBookmarks) {
+  if (featureFlags.APP_STORE_BUILD && customModelsBookmarks) {
     console.log(
       "🚀 => file: get-models.ts:18 => customModelsBookmarks:",
       customModelsBookmarks

renderer/components/settings-tab/CompressionInput.tsx

@@ -15,6 +15,13 @@ export function CompressionInput({
           EXPERIMENTAL
         </p>
       </div>
+      {compression > 0 && (
+        <p className="text-xs text-base-content/80">
+          This option can cause color issues with some images. For PNGs, if you
+          use compression, they'll use indexed colors. Keep compression to 0 for
+          PNGs for lossless quality.
+        </p>
+      )}
       <input
         type="range"
         placeholder="Type here"

renderer/components/settings-tab/ImageFormatSelect.tsx

@@ -1,4 +1,6 @@
-import React from "react";
+import { noImageProcessingAtom } from "@/atoms/userSettingsAtom";
+import { useAtomValue } from "jotai";
+import React, { useEffect } from "react";
 
 type ImageFormatSelectProps = {
   batchMode: boolean;
@@ -11,35 +13,42 @@ export function ImageFormatSelect({
   saveImageAs,
   setExportType,
 }: ImageFormatSelectProps) {
+  const noImageProcessing = useAtomValue(noImageProcessingAtom);
+
+  useEffect(() => {
+    if (noImageProcessing) {
+      setExportType("png");
+    }
+  }, [noImageProcessing]);
+
   return (
     <div className="flex flex-col gap-2">
       <div className="flex flex-row gap-1">
         <p className="text-sm font-medium">SAVE IMAGE AS</p>
-        <p className="badge-primary badge text-[10px] font-medium">
+        {/* <p className="badge-primary badge text-[10px] font-medium">
           EXPERIMENTAL
-        </p>
+        </p> */}
       </div>
       <div className="flex flex-col gap-2">
-        {batchMode && (
-          <p className="text-xs text-base-content/70">
-            Only PNG is supported in Batch Upscayl.
+        {batchMode && <p className="text-xs text-base-content/80"></p>}
+        {noImageProcessing && (
+          <p className="text-xs text-base-content/80">
+            {batchMode && "Only PNG is supported in Batch Upscayl."} Only PNGs
+            are saved without image processing to preserve image quality.
           </p>
         )}
         <div className="flex flex-wrap gap-2">
           {/* PNG */}
           <button
-            className={`btn ${
-              saveImageAs === "png" && "btn-primary"
-            }`}
+            className={`btn ${saveImageAs === "png" && "btn-primary"}`}
             onClick={() => setExportType("png")}>
             PNG
           </button>
           {/* JPG */}
           <button
-            className={`btn ${
-              saveImageAs === "jpg" && "btn-primary"
-            }`}
-            onClick={() => setExportType("jpg")}>
+            className={`btn ${saveImageAs === "jpg" && "btn-primary"}`}
+            onClick={() => setExportType("jpg")}
+            disabled={noImageProcessing}>
             JPG
           </button>
           {/* WEBP

renderer/components/settings-tab/ImageScaleSelect.tsx

@@ -10,10 +10,10 @@ export function ImageScaleSelect({ scale, setScale }: ImageScaleSelectProps) {
     <div>
       <div className="flex flex-row gap-1">
         <p className="text-sm font-medium">IMAGE SCALE</p>
-
+        {/* 
         <p className="badge-primary badge text-[10px] font-medium">
           EXPERIMENTAL
-        </p>
+        </p> */}
       </div>
       <input
         type="range"

renderer/pages/index.tsx

@@ -449,7 +449,7 @@ const Home = () => {
           saveImageAs,
           scale,
           noImageProcessing,
-          compression,
+          compression: compression.toString(),
         });
         logit("🏁 DOUBLE_UPSCAYL");
       } else if (batchMode) {
@@ -463,7 +463,7 @@ const Home = () => {
           saveImageAs,
           scale,
           noImageProcessing,
-          compression,
+          compression: compression.toString(),
         });
         logit("🏁 FOLDER_UPSCAYL");
       } else {
@@ -477,7 +477,7 @@ const Home = () => {
           scale,
           overwrite,
           noImageProcessing,
-          compression,
+          compression: compression.toString(),
         });
         logit("🏁 UPSCAYL");
       }