Add profile photo uploads and custom difficulty support

components/Game.tsx

@@ -15,7 +15,7 @@ import { Brand } from "./Brand";
 import { Panorama } from "./Panorama";
 import { GuessMap, type Pin } from "./GuessMap";
 import { api } from "./StartGame";
-import { difficulties, type Difficulty, type Bounds } from "@/shared/protocol";
+import type { DifficultyPreset, Bounds } from "@/shared/protocol";
 import { roundClock } from "@/shared/round-clock";
 import { ReportContent } from "./ReportContent";
 export type RoundResult = {
@@ -28,7 +28,8 @@ export type RoundResult = {
 export type SessionView = {
   id: string;
   name: string;
-  difficulty: Difficulty;
+  difficulty: string;
+  difficultySettings: DifficultyPreset;
   round: number;
   bounds: Bounds;
   map: string;
@@ -74,7 +75,7 @@ export function Game({ id }: { id: string }) {
               s.rounds[s.round].deadline!,
               performance.now(),
             )
-          : difficulties[s.difficulty].seconds,
+          : s.difficultySettings.seconds,
       );
     } catch (e) {
       if (version === loadVersion.current) setError((e as Error).message);
@@ -196,7 +197,7 @@ export function Game({ id }: { id: string }) {
         <Panorama
           key={session.round}
           urls={current.faces}
-          zoom={difficulties[session.difficulty].zoom}
+          zoom={session.difficultySettings.zoom}
           onReady={ready}
           onError={onError}
         />
@@ -289,7 +290,9 @@ export function Game({ id }: { id: string }) {
         </span>
         <span>
           <MousePointer2 size={12} />{" "}
-          {session?.difficulty === "hard" ? t("NO ZOOM") : t("SCROLL TO ZOOM")}
+                {session && !session.difficultySettings.zoom
+                  ? t("NO ZOOM")
+                  : t("SCROLL TO ZOOM")}
         </span>
       </div>
       {(!session || !loaded.panorama || !loaded.map) && !error && (