chore: update based on review

Signed-off-by: Charlie Drage <[email protected]>
podman-desktop · Dec 16, 2024 · f86033d · f86033d
1 parent e2f8ec1
commit f86033d
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 19 deletions.
diff --git a/packages/backend/src/build-disk-image.spec.ts b/packages/backend/src/build-disk-image.spec.ts
@@ -477,7 +477,7 @@ test('test createBuildConfigJSON function works when passing in a build config w
     user: [
       {
         name: 'test-user',
-        // eslint-disable-next-line sonarjs/no-hardcoded-credentials
+        // eslint-disable-next-line sonarjs/no-hardcoded-passwords
         password: 'test-password',
         key: 'test-key',
         groups: ['test-group'],
@@ -514,7 +514,7 @@ test('test building with a buildConfig JSON file that a temporary file for build
     user: [
       {
         name: 'test-user',
-        // eslint-disable-next-line sonarjs/no-hardcoded-credentials
+        // eslint-disable-next-line sonarjs/no-hardcoded-passwords
         password: 'test-password',
         key: 'test-key',
         groups: ['test-group'],

diff --git a/packages/backend/src/build-disk-image.ts b/packages/backend/src/build-disk-image.ts
@@ -471,12 +471,10 @@ export function createBuilderImageOptions(
 
     // Make sure that cutomizations is exists and is not empty before adding it to the container.
     if (buildConfig.customizations && Object.keys(buildConfig.customizations).length > 0) {
-      // Create a temporary path to store the buildConfig JSON
-      // with a temporary name
-      // eslint-disable-next-line sonarjs/pseudo-random
-      const buildConfigPath = path.join(os.tmpdir(), `${Math.floor(Math.random() * 100000)}.json`);
+      // Use the folder of the build to store the buildConfig JSON file as config.json
+      const buildConfigPath = path.join(build.folder, 'config.json');
 
-      // Write the buildConfig JSON to the temporary file with JSON
+      // Write the buildConfig JSON to the file we'll be using
       fs.writeFileSync(buildConfigPath, JSON.stringify(buildConfig, undefined, 2));
 
       // Add the mount to the configuration file

diff --git a/packages/frontend/src/Build.svelte b/packages/frontend/src/Build.svelte
@@ -81,6 +81,11 @@ function toggleBuildConfig() {
   showBuildConfig = !showBuildConfig;
 }
 
+let showBuildConfigFile = false;
+function toggleBuildConfigFile() {
+  showBuildConfigFile = !showBuildConfigFile;
+}
+
 function findImage(repoTag: string): ImageInfo | undefined {
   return bootcAvailableImages.find(
     image => image.RepoTags && image.RepoTags.length > 0 && image.RepoTags[0] === repoTag,
@@ -764,14 +769,15 @@ $: if (availableArchitectures) {
                 class="font-semibold mb-2 block cursor-pointer"
                 aria-label="build-config-options"
                 on:click={toggleBuildConfig}
-                ><Fa icon={showBuildConfig ? faCaretDown : faCaretRight} class="inline-block mr-1" />Build config
+                ><Fa icon={showBuildConfig ? faCaretDown : faCaretRight} class="inline-block mr-1" />Interactive build
+                config
               </span>
               {#if showBuildConfig}
                 <p class="text-sm text-[var(--pd-content-text)] mb-2">
                   Supplying the following fields will create a build config file that contains the build options for the
-                  disk image. Customizations include user, password, SSH keys and kickstart files. More information can
-                  be found in the <Link
-                    externalRef="https://github.com/osbuild/bootc-image-builder?tab=readme-ov-file#-build-config"
+                  disk image. This will be saved in the <b>same directory as your output folder</b>. More information
+                  can be found in the <Link
+                    externalRef="https://github.com/osbuild/bootc-image-builder?tab=readme-ov-file\#-build-config"
                     >bootc-image-builder documentation</Link
                   >.
                 </p>
@@ -838,7 +844,7 @@ $: if (availableArchitectures) {
                     <Input
                       bind:value={filesystem.minsize}
                       id="buildConfigFilesystemMinimumSize.${index}"
-                      placeholder="Minimum size (ex. 30 GiB)" />
+                      placeholder="Minimum size (ex. '30 GiB')" />
 
                     <Button
                       type="link"
@@ -864,12 +870,30 @@ $: if (availableArchitectures) {
                   id="buildConfigKernelArguments"
                   placeholder="Kernel arguments (ex. quiet)"
                   class="w-full" />
-
+              {/if}
+            </div>
+            <div class="mb-2">
+              <!-- Use a span for this until we have a "dropdown toggle" UI element implemented. -->
+              <!-- svelte-ignore a11y-click-events-have-key-events -->
+              <!-- svelte-ignore a11y-no-static-element-interactions -->
+              <span
+                class="font-semibold mb-2 block cursor-pointer"
+                aria-label="build-config-options"
+                on:click={toggleBuildConfigFile}
+                ><Fa icon={showBuildConfigFile ? faCaretDown : faCaretRight} class="inline-block mr-1" />Build config
+                file
+              </span>
+              {#if showBuildConfigFile}
+                <p class="text-sm text-[var(--pd-content-text)] mb-2">
+                  Supplying a file will override <b>ANY</b> changes done in the build config interactive mode. More
+                  information can be found in the <Link
+                    externalRef="https://github.com/osbuild/bootc-image-builder?tab=readme-ov-file\#-build-config"
+                    >bootc-image-builder documentation</Link
+                  >.
+                </p>
                 <div>
-                  <span class="block mt-6">File</span>
+                  <span class="block mt-4">File</span>
                 </div>
-
-                <!-- Build config -->
                 <div class="mb-2">
                   <div class="flex flex-row space-x-3">
                     <Input
@@ -881,9 +905,6 @@ $: if (availableArchitectures) {
                       aria-label="buildconfig-select" />
                     <Button on:click={() => getBuildConfigFile()}>Browse...</Button>
                   </div>
-                  <p class="text-sm text-[var(--pd-content-text)] pt-2">
-                    This will override any above user-specific input and use the supplied file only.
-                  </p>
                 </div>
               {/if}
             </div>