From 15a5054a785dafd8f9e437fe3ebdacd199144478 Mon Sep 17 00:00:00 2001
From: multipleof4 <planetrenox@protonmail.com>
Date: Fri, 20 Mar 2026 21:29:51 -0700
Subject: [PATCH] Fix: createIcons({icons}) + reliable icon refresh

---
 assets/js/app.js | 35 +++++++++++++++++++++++++++--------
 1 file changed, 27 insertions(+), 8 deletions(-)

diff --git a/assets/js/app.js b/assets/js/app.js
index 540d2a9..a09efbb 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -2,6 +2,8 @@ import { generateImageFrame } from "./openrouter.js";
 import { buildGifFromFrames } from "./gif.js";
 import { firstPrompt, nextFramePrompt, clampForm } from "./ui.js";
 
+const GEMINI_MODEL = "google/gemini-3.1-flash-image-preview";
+
 window.vibeGifApp = function () {
   return {
     settingsOpen: false,
@@ -15,7 +17,7 @@ window.vibeGifApp = function () {
     gifUrl: "",
 
     form: {
-      model: "google/gemini-3.1-flash-image-preview",
+      model: GEMINI_MODEL,
       userPrompt: "",
       frameCount: 4,
       fps: 6,
@@ -23,9 +25,21 @@ window.vibeGifApp = function () {
       aspectRatio: "1:1"
     },
 
+    isGeminiModel(model) {
+      return model === GEMINI_MODEL;
+    },
+
     refreshIcons() {
-      if (!window.lucide?.createIcons) return;
-      window.lucide.createIcons();
+      const L = window.lucide;
+      if (!L?.createIcons) return;
+
+      try {
+        // Newer lucide builds can require icons object
+        L.createIcons({ icons: L.icons });
+      } catch (_) {
+        // Backward compatibility fallback
+        try { L.createIcons(); } catch {}
+      }
     },
 
     init() {
@@ -33,13 +47,18 @@ window.vibeGifApp = function () {
       this.apiKeyInput = this.apiKey || "";
 
       this.$nextTick(() => this.refreshIcons());
-      setTimeout(() => this.refreshIcons(), 0);
-      setTimeout(() => this.refreshIcons(), 120);
+      window.addEventListener("load", () => this.refreshIcons());
+      document.addEventListener("alpine:initialized", () => this.refreshIcons());
 
-      this.$watch("settingsOpen", () => this.$nextTick(() => this.refreshIcons()));
+      this.$watch("settingsOpen", () => {
+        this.$nextTick(() => this.refreshIcons());
+      });
 
-      this.$watch("form.model", () => {
-        if (this.form.model !== "google/gemini-3.1-flash-image-preview" && this.form.imageSize === "0.5K") {
+      this.$watch("form.model", (model) => {
+        if (!this.isGeminiModel(model) && this.form.imageSize !== "1K") {
+          this.form.imageSize = "1K";
+        }
+        if (this.isGeminiModel(model) && !["1K", "0.5K"].includes(this.form.imageSize)) {
           this.form.imageSize = "1K";
         }
       });