Move files back to public after turning off vite's publicDir feature,…

… ensuring that ./scripts/start.sh and ./scripts/client-dev.sh still work

.gitignore

@@ -15,6 +15,5 @@ metals.sbt
 .bloop
 .bsp/
 .java-version
-video-ui/build
 **/manifest.json
 .vite

app/controllers/VideoUIApp.scala

@@ -27,20 +27,14 @@ class VideoUIApp(val authActions: HMACAuthActions, conf: Configuration, awsConfi
 
     val jsFileName = "video-ui/build/app.js"
 
-    val jsAssetHost = sys.env.get("JS_ASSET_HOST")
-
-    val isHotReloading = jsAssetHost match {
-      case Some(_) if awsConfig.isDev => true
+    val isHotReloading = sys.env.get("RELOADING") match {
+      case Some("HOT") if awsConfig.isDev => true
       case _ => false
     }
 
-    val jsLocation = if (isHotReloading) {
-      jsAssetHost.get + jsFileName
-    } else {
-      routes.Assets.versioned(jsFileName).toString
-    }
+    val jsLocation = routes.Assets.versioned(jsFileName).toString
+
 
-    val stage = conf.get[String]("stage")
     val composerUrl = awsConfig.composerUrl
 
     val permissions = permissionsProvider.getAll(req.user)
@@ -54,7 +48,7 @@ class VideoUIApp(val authActions: HMACAuthActions, conf: Configuration, awsConfi
       liveCapiProxyUrl = "/support/liveCapi",
       composerUrl = composerUrl,
       ravenUrl = conf.get[String]("raven.url"),
-      stage,
+      stage = conf.get[String]("stage"),
       viewerUrl = awsConfig.viewerUrl,
       permissions,
       minDurationForAds = youtube.minDurationForAds,
@@ -71,7 +65,6 @@ class VideoUIApp(val authActions: HMACAuthActions, conf: Configuration, awsConfi
       Json.toJson(clientConfig).toString(),
       isHotReloading,
       CSRF.getToken.value,
-      stage,
     ))
   }
 

app/views/VideoUIApp/app.scala.html

@@ -6,7 +6,6 @@
   clientConfigJson: String,
   isHotReloading: Boolean,
   csrf: String,
-  stage: String
 )
 
 @layout(title, isHotReloading, csrf) {
@@ -23,7 +22,7 @@ <h1>Loading...</h1>
     }
     <script type="module">window.global = window</script>
 
-    @if(stage == "DEV") {
+    @if(isHotReloading) {
         <!-- Connect directly to Vite dev server in development -->
         <!-- See https://vitejs.dev/guide/backend-integration.html -->
       <script type="module">
@@ -36,7 +35,7 @@ <h1>Loading...</h1>
         window.__vite_plugin_react_preamble_installed__ = true
       </script>
       <script type="module" src="http://localhost:5173/@@vite/client"></script>
-      <script type="module" src="http://localhost:5173/video-ui/src/app.jsx"></script>
+      <script type="module" src="http://localhost:5173/public/video-ui/src/app.jsx"></script>
     } else {
       <link rel="stylesheet" type="text/css" href="/build/index.css">
       <script type="module" src="@jsFileLocation"></script>

package.json

@@ -3,14 +3,13 @@
   "description": "media atom editor",
   "scripts": {
     "build": "tsc && vite build",
-    "build-dev": "webpack -o ./video-ui/build/ --config ./build_config/webpack.dev.conf.js --watch",
     "client-dev": "vite",
-    "lint": "eslint video-ui/src/**/*.js",
+    "lint": "eslint public/video-ui/src/**/*.(js|ts)*",
     "test": "jest"
   },
   "jest": {
     "roots": [
-      "video-ui/src/test"
+      "public/video-ui/src/test"
     ],
     "preset": "ts-jest/presets/js-with-ts"
   },

video-ui/src/components/VideoPublishBar/VideoPublishBar.jsx → public/video-ui/src/components/VideoPublishBar/VideoPublishBar.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { saveStateVals } from '../../constants/saveStateVals';
 import { isVideoPublished } from '../../util/isVideoPublished';
 import { hasUnpublishedChanges } from '../../util/hasUnpublishedChanges';
-import ScheduledLaunch from '../../components/ScheduledLaunch/ScheduledLaunch';
+import ScheduledLaunch from '../ScheduledLaunch/ScheduledLaunch';
 import { canonicalVideoPageExists } from '../../util/canonicalVideoPageExists';
 import VideoUtils from '../../util/video';
 

video-ui/src/components/VideoSearch/VideoSearch.jsx → public/video-ui/src/components/VideoSearch/VideoSearch.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { saveStateVals } from '../../constants/saveStateVals';
-import Icon from '../../components/Icon';
+import Icon from '../Icon';
 
 export default class VideoSearch extends React.Component {
   onSearch = e => {

video-ui/src/routes.jsx → public/video-ui/src/routes.jsx

@@ -3,7 +3,7 @@ import { Router, Route, browserHistory, IndexRedirect, Redirect } from 'react-ro
 
 import Search from './pages/Search';
 import Video from './pages/Video';
-import Upload from './pages/Upload/';
+import Upload from './pages/Upload';
 import Help from './pages/Help';
 import Training from './pages/Training';
 import ReactApp from './components/ReactApp';

video-ui/src/util/getComposerData.js → public/video-ui/src/util/getComposerData.js

@@ -1,7 +1,7 @@
 import { parseComposerDataFromImage } from './parseGridMetadata';
-import { getStore } from '../util/storeAccessor';
+import { getStore } from './storeAccessor';
 import { impossiblyDistantDate }  from '../constants/dates';
-import VideoUtils from '../util/video';
+import VideoUtils from './video';
 
 export function getComposerData(video) {
 

scripts/client-dev.sh

@@ -23,4 +23,4 @@ set_node_version
 printf "\n\rStarting Vite Dev Server... \n\r\n\r"
 yarn run client-dev &
 printf "\n\rStarting Play App... \n\r\n\r"
-sbt $@ app/run
+RELOADING=HOT sbt $@ app/run

tsconfig.json

@@ -17,7 +17,7 @@
       "forceConsistentCasingInFileNames": true,
   },
   "include": [
-      "video-ui/src/**/*",
+      "public/video-ui/src/**/*",
   ],
   "exclude": [
       "public/video-ui/build/**/*"

vite.config.js

@@ -1,28 +1,29 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react-swc'
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react-swc';
 
 export default defineConfig({
   base: '',
   plugins: [react()],
+  publicDir: false, // This feature is deactivated because the 'public' dir also has a special meaning for the Play framework
   build: {
     manifest: true,
     rollupOptions: {
-      input: './video-ui/src/app.jsx',
+      input: './public/video-ui/src/app.jsx',
       output: {
-        entryFileNames: `build/[name].js`,
-        chunkFileNames: `build/[name].js`,
-        assetFileNames: `build/[name].[ext]`
+        entryFileNames: `[name].js`,
+        chunkFileNames: `[name].js`,
+        assetFileNames: `[name].[ext]`
       }
     },
-    outDir: "./public/video-ui/",
+    outDir: "./public/video-ui/build",
     emptyOutDir: true
   },
   server: {
     origin: 'http://localhost:5173',
     // We depend upon this port number in a few places, so fail fast if we cannot allocate it.
     strictPort: true,
     fs: {
-      allow: ['/video-ui/fonts', './']
+      allow: ['/public/video-ui/fonts', './']
     }
   }
-})
+});