Fix prod vite config

Author: vtm9

k8s/app-chart/values.yaml

@@ -16,7 +16,7 @@ codebattle:
   affinity: {}
   replicaCount: 1
   image:
-    repository: codebattle/codebattle
+    repository: hexlet-codebattle/codebattle
     imagePullPolicy: Always
   service:
     type: ClusterIP
@@ -30,32 +30,32 @@ runner:
   # Deployment or DaemonSet
   type: Deployment
   image:
-    repository: codebattle/runner
+    repository: hexlet-codebattle/runner
     imagePullPolicy: Always
 
 chatbot:
-  enabled: true
+  enabled: false
   replicaCount: 1
   image:
-    repository: codebattle/chat_bot
+    repository: hexlet-codebattle/chat_bot
     imagePullPolicy: Always
     tag: "0.0.1"
 
 nginx:
   image:
-    repository: codebattle/nginx-assets
+    repository: hexlet-codebattle/nginx-assets
     imagePullPolicy: Always
 
 runnerRust:
   enabled: false
   langs:
     - name: rust
-      image: codebattle/rust:1.76.0
+      image: hexlet-codebattle/rust:1.76.0
       replicaCount: 1
     - name: js
-      image: codebattle/js:20.11.1
+      image: hexlet-codebattle/js:20.11.1
       replicaCount: 2
-    - name: python
+    - name: hexlet-python
       image: codebattle/python:3.12.2
       replicaCount: 3
 

services/app/apps/codebattle/lib/codebattle_web/vite.ex

@@ -16,17 +16,50 @@ defmodule CodebattleWeb.Vite do
     end
   end
 
-  def asset_path(entry) do
-    case manifest()[entry] do
-      %{"file" => file} -> "/assets/" <> file
-      _ -> "/assets/" <> entry
+  # Apply Phoenix digest hash to a path in production
+  defp apply_digest(path) do
+    if dev?() do
+      path
+    else
+      # Use Phoenix's static path to get the digested version
+      # Routes.static_path uses the endpoint's static_path/1
+      CodebattleWeb.Endpoint.static_path(path)
     end
   end
 
+  def asset_path(entry) do
+    path =
+      case manifest()[entry] do
+        %{"file" => file} -> "/assets/" <> file
+        _ -> "/assets/" <> entry
+      end
+
+    apply_digest(path)
+  end
+
   def css_paths(entry) do
-    case manifest()[entry] do
-      %{"css" => css_list} -> Enum.map(css_list, &("/assets/" <> &1))
-      _ -> []
-    end
+    paths =
+      case manifest()[entry] do
+        %{"css" => css_list} ->
+          # CSS imported by this JS entry
+          Enum.map(css_list, &("/assets/" <> &1))
+
+        _ ->
+          # No CSS imported by this entry, look for standalone CSS
+          # Try to find a CSS file that matches the JS entry name
+          # For "app.js", look for any entry that outputs "app.css"
+          css_filename = String.replace(entry, ~r/\.js$/, ".css")
+
+          # Search through all manifest entries to find one with matching output
+          case Enum.find(manifest(), fn {_k, v} ->
+                 is_map(v) && Map.get(v, "file") == css_filename
+               end) do
+            {_key, %{"file" => file}} -> ["/assets/" <> file]
+            _ -> []
+          end
+      end
+
+    # Apply digest hash to all paths in production
+    Enum.map(paths, &apply_digest/1)
   end
 end

services/app/apps/codebattle/vite.config.js

@@ -44,6 +44,8 @@ const input = {
   landing: path.resolve(__dirname, "assets/js/landing.js"),
   external: path.resolve(__dirname, "assets/js/external.js"),
   styles: path.resolve(__dirname, "assets/css/style.scss"),
+  // Note: landing.css and external.css use the same styles as app.css
+  // Templates should reference app.css instead
   // broadcast_editor: path.resolve(__dirname, "assets/js/widgets/pages/broadcast-editor/index.js"),
   // stream: path.resolve(__dirname, "assets/js/widgets/pages/broadcast-editor/stream.js"),
 };
@@ -77,11 +79,22 @@ export default defineConfig(({ command, mode }) => ({
   build: {
     outDir: "priv/static/assets",
     assetsDir: "",
-    manifest: true,
+    manifest: "manifest.json",
     sourcemap: mode === "development",
     rollupOptions: {
       input,
-      output: { manualChunks: { monaco: ["monaco-editor"] } },
+      output: {
+        entryFileNames: "[name].js",
+        chunkFileNames: "[name]-[hash].js",
+        assetFileNames: (assetInfo) => {
+          // Rename styles.css to app.css for backwards compatibility
+          if (assetInfo.name === 'styles.css') {
+            return 'app.css';
+          }
+          return "[name].[ext]";
+        },
+        manualChunks: { monaco: ["monaco-editor"] },
+      },
     },
     emptyOutDir: true,
   },