Improve UI stability, reliability, and readability (#1104)

closes #1090
closes #1030

Also fixes various styling issues and overflow issues for mobile support

photon-client/src/lib/PhotonUtils.ts

@@ -0,0 +1,20 @@
+import type { Resolution } from "@/types/SettingTypes";
+
+export const resolutionsAreEqual = (a: Resolution, b: Resolution) => {
+  return a.height === b.height && a.width === b.width;
+};
+
+export const getResolutionString = (resolution: Resolution): string => `${resolution.width}x${resolution.height}`;
+
+export const parseJsonFile = async <T extends Record<string, any>>(file: File): Promise<T> => {
+  return new Promise((resolve, reject) => {
+    const fileReader = new FileReader();
+    fileReader.onload = (event) => {
+      const target: FileReader | null = event.target;
+      if (target === null) reject();
+      else resolve(JSON.parse(target.result as string) as T);
+    };
+    fileReader.onerror = (error) => reject(error);
+    fileReader.readAsText(file);
+  });
+};