chore: match API arch->target changes

CONTRIBUTING.md

@@ -10,7 +10,7 @@ At the highest level you must at least have:
 
 * [NodeJS](https://nodejs.org/en/)
 * [pnpm](https://pnpm.io/)
-* terminal
+* terminal (Bash is suggested but not required.)
 
 ### pnpm installation
 
@@ -39,6 +39,8 @@ Now you're good to go!
 
 ## Local Development
 
+See the [Readme](README.md) for how to point your local frontend to the staging or production API.
+
 After you've installed everything, start the project via:
 
 ```sh

README.md

@@ -24,6 +24,7 @@ The `dev` script executes several processes:
 
 * Development Server
 * Svelte Checker
+* GraphQL Code Generator
 * ESLint
 
 ```shell

cspell.json

@@ -5,7 +5,7 @@
   // language - current active spelling language
   "language": "en",
   // words - list of words to be always considered correct
-  "words": ["cfworker", "felte", "prismjs", "smui", "urql", "wonka"],
+  "words": ["cfworker", "felte", "ficsit", "pnpx", "prismjs", "smui", "urql", "webp", "wonka"],
   // flagWords - list of words to be always considered incorrect
   // This is useful for offensive words and common spelling errors.
   // cSpell:disable (don't complain about the words we listed here)

src/gql/admin/sml-versions/sml_version_admin.graphql

@@ -4,15 +4,15 @@ query GetSMLVersionAdmin($smlVersionID: SMLVersionID!) {
     version
     stability
     link
-    arch {
-      id
-      platform
+    targets {
+      targetName
       link
     }
     changelog
     created_at
     date
     satisfactory_version
     bootstrap_version
+    engine_version
   }
 }

src/gql/admin/sml-versions/sml_versions_admin.graphql

@@ -5,16 +5,16 @@ query GetSMLVersionsAdmin($filter: SMLVersionFilter) {
       version
       stability
       link
-      arch {
-        id
-        platform
+      targets {
+        targetName
         link
       }
       changelog
       created_at
       date
       satisfactory_version
       bootstrap_version
+      engine_version
     }
     count
   }

src/gql/admin/version/unapproved_versions.graphql

@@ -6,10 +6,9 @@ query GetUnapprovedVersions($filter: VersionFilter) {
       version
       stability
       link
-      arch {
-        id
-        platform
-        asset
+      targets {
+        targetName
+        link
       }
       changelog
       created_at

src/gql/mods/mod.graphql

@@ -13,44 +13,50 @@ query GetMod($mod: String!) {
       alpha {
         id
         link
-        arch {
-          id
-          ModVersionID
-          platform
-          asset
+        targets {
+          targetName
+          link
           hash
           size
         }
+        dependencies {
+          mod_id
+          condition
+        }
         version
         created_at
         sml_version
       }
       beta {
         id
         link
-        arch {
-          id
-          ModVersionID
-          platform
-          asset
+        targets {
+          targetName
+          link
           hash
           size
         }
+        dependencies {
+          mod_id
+          condition
+        }
         version
         created_at
         sml_version
       }
       release {
         id
         link
-        arch {
-          id
-          ModVersionID
-          platform
-          asset
+        targets {
+          targetName
+          link
           hash
           size
         }
+        dependencies {
+          mod_id
+          condition
+        }
         version
         created_at
         sml_version

src/gql/mods/versions.graphql

@@ -13,11 +13,9 @@ query GetModVersions($mod: ModID!, $limit: Int!, $offset: Int!) {
       link
       hash
       size
-      arch {
-        id
-        ModVersionID
-        platform
-        asset
+      targets {
+        targetName
+        link
         hash
         size
       }

src/gql/sml/sml_versions.graphql

@@ -7,9 +7,8 @@ query GetSMLVersions($limit: Int!, $offset: Int!) {
       stability
       changelog
       link
-      arch {
-        id
-        platform
+      targets {
+        targetName
         link
       }
       date

src/gql/versions/mod_version.graphql

@@ -10,11 +10,9 @@ query GetModVersion($version: VersionID!) {
     link
     hash
     size
-    arch {
-      id
-      ModVersionID
-      platform
-      asset
+    targets {
+      targetName
+      link
       hash
       size
     }
@@ -27,5 +25,9 @@ query GetModVersion($version: VersionID!) {
         user_id
       }
     }
+    dependencies {
+      mod_id
+      condition
+    }
   }
 }

src/lib/components/general/FicsitCard.svelte

@@ -41,12 +41,14 @@
     class:text-gray-500={fake}
     class:font-flow={fake}
     class="grid grid-max-auto sm:grid-cols-2 grid-cols-1 justify-items-center">
-    <div class="cursor-pointer card-image-container" on:click={() => goto(link)} on:keypress={() => goto(link)}>
-      {#if fake}
-        <div class="bg-gray-500 logo min-w-full min-h-full max-w-full max-h-full" />
-      {:else}
-        <img src={renderedLogo} alt="{renderedName} Logo" class="logo max-w-full max-h-full" />
-      {/if}
+    <div class="cursor-pointer card-image-container">
+      <a href={link} on:keypress={() => goto(link)}>
+        {#if fake}
+          <div class="bg-gray-500 logo min-w-full min-h-full max-w-full max-h-full" />
+        {:else}
+          <img src={renderedLogo} alt="{renderedName} Logo" class="logo max-w-full max-h-full" />
+        {/if}
+      </a>
     </div>
     <div class="w-full flex flex-col justify-between">
       <Content class="flex flex-col pb-0">

src/lib/components/mods/ModInfo.svelte

@@ -19,6 +19,14 @@
   <Content>
     <div class="text-lg break-words">
       <h3 class="text-2xl my-4 font-bold">Info</h3>
+      <span
+        ><strong>Tags:</strong>
+        {#if mod.tags.length === 0}
+          <div class="tags">(No tags assigned)</div>
+        {:else}
+          <TagList tags={mod.tags} />
+        {/if}
+      </span>
       <span
         ><strong>{$t('entry.source')}:</strong>
         <a class="underline text-yellow-500" href={mod.source_url}>{mod.source_url}</a></span

src/lib/components/mods/ModLatestVersions.svelte

@@ -1,16 +1,22 @@
 <script lang="ts">
-  import type { Version } from '$lib/generated';
-  import { API_REST } from '$lib/core';
   import { base } from '$app/paths';
   import Card, { Content } from '@smui/card';
   import { Icon } from '@smui/common';
   import { prettyDate } from '$lib/utils/formatting';
   import { getTranslate } from '@tolgee/svelte';
+  import { installMod } from '$lib/stores/launcher';
+  import VersionTargetSupportGrid from '$lib/components/versions/VersionTargetSupportGrid.svelte';
+  import VersionDependenciesGrid from '$lib/components/versions/VersionDependenciesGrid.svelte';
+  import type { Version, VersionDependency, VersionTarget } from '$lib/generated';
+
+  type IVersion = Pick<Version, 'id' | 'link' | 'version' | 'created_at'> & {
+    targets?: Pick<VersionTarget, 'targetName' | 'size' | 'hash'>[];
+  } & { dependencies?: Pick<VersionDependency, 'mod_id' | 'condition'>[] };
 
   type ILatestVersions = {
-    alpha?: Pick<Version, 'id' | 'link' | 'version' | 'created_at'>;
-    beta?: Pick<Version, 'id' | 'link' | 'version' | 'created_at'>;
-    release?: Pick<Version, 'id' | 'link' | 'version' | 'created_at'>;
+    alpha?: IVersion;
+    beta?: IVersion;
+    release?: IVersion;
   };
 
   const stabilities = {
@@ -33,22 +39,26 @@
       {#each Object.keys(stabilities) as stability}
         {#if latestVersions[stability]}
           <div class="version">
-            <div class="text-4xl w-14 h-14 p-2.5">
+            <div class="text-4xl w-14 h-14 p-2.5" title={`Latest ${stability} release`}>
               <Icon class="material-icons">{stabilities[stability]}</Icon>
             </div>
             <div class="grid grid-flow-row">
               <a href="{base}/mod/{modId}/version/{latestVersions[stability].id}/" class="text-yellow-500 underline"
-                >Version {latestVersions[stability].version}</a>
+                >Version {latestVersions[stability].version} ({stability})</a>
               <div>{prettyDate(latestVersions[stability].created_at)}</div>
             </div>
-            <div class="text-3xl w-14 h-14 p-2.5">
+            <div class="text-1xl col-span-3 w-auto h-auto p-2.5">
               <a
-                href={API_REST + '/mod/' + modId + '/versions/' + latestVersions[stability].id + '/download'}
-                class="text-yellow-500 underline">
-                <Icon class="material-icons">download</Icon>
+                href="#top"
+                on:click={() => installMod(modId)}
+                title="Install via Satisfactory Mod Manager"
+                class="text-yellow-500">
+                <Icon class="material-icons align-middle" style="font-size: 118x;">download</Icon> <u>Download</u>
               </a>
             </div>
           </div>
+          <VersionTargetSupportGrid targets={latestVersions[stability].targets} />
+          <VersionDependenciesGrid dependencies={latestVersions[stability].dependencies} />
         {/if}
       {/each}
     </div>

src/lib/components/mods/ModLogo.svelte

@@ -11,6 +11,8 @@
 </script>
 
 <div class="relative overflow-hidden">
-  <OutdatedBanner {compatibility} logo={true} />
-  <img class="rounded-lg sm:max-w-lg max-w-full w-full" src={logo} alt="Logo for {modName}" />
+  <div class="sm:max-w-lg max-w-full w-full">
+    <OutdatedBanner {compatibility} logo={true} />
+    <img class="rounded-lg" src={logo} alt="Logo for {modName}" />
+  </div>
 </div>

src/lib/components/mods/ModVersions.svelte

@@ -10,7 +10,7 @@
   import List, { Item } from '@smui/list';
   import Button, { Group, GroupItem, Label, Icon } from '@smui/button';
   import { installMod } from '$lib/stores/launcher';
-  import { prettyDate, prettyNumber, prettyBytes, prettyArch } from '$lib/utils/formatting';
+  import { prettyDate, prettyNumber, prettyBytes, prettyTarget } from '$lib/utils/formatting';
   import { getTranslate } from '@tolgee/svelte';
 
   export let modId!: string;
@@ -79,7 +79,7 @@
                 }}>
                 <Button variant="outlined" href={base + '/mod/' + modId + '/version/' + version.id}
                   >{$t('view')}</Button>
-                {#if version.arch.length != 0}
+                {#if version.targets.length !== 0}
                   <Group variant="outlined">
                     <Button
                       variant="outlined"
@@ -96,7 +96,7 @@
                       </Button>
                       <Menu bind:this={menus[i]} anchorCorner="TOP_LEFT">
                         <List>
-                          {#each version.arch as arch, _}
+                          {#each version.targets as target, _}
                             <Item>
                               <Button
                                 class="w-full"
@@ -107,8 +107,8 @@
                                   '/versions/' +
                                   version.id +
                                   '/' +
-                                  arch.platform +
-                                  '/download'}>{$t('download')} {prettyArch(arch.platform)}</Button>
+                                  target.targetName +
+                                  '/download'}>{$t('download')} {prettyTarget(target.targetName)}</Button>
                             </Item>
                           {/each}
                         </List>