Merge remote-tracking branch 'origin/release/0.3.3' into feature/typescriptify-storage-entities

# Conflicts:
#	src/app.d.ts

src/app.d.ts

@@ -19,6 +19,7 @@ declare global {
       | "globe"
       | "plus"
       | "file-export"
+      | "trash"
       );
 
     interface EntityNamesMap {

src/routes/features/maintenance/[id]/+page.svelte

@@ -57,6 +57,9 @@
     <MenuItem icon="file-export" href="/features/maintenance/{profileId}/export">
         Export Profile
     </MenuItem>
+    <MenuItem icon="trash" href="/features/maintenance/{profileId}/delete">
+        Delete Profile
+    </MenuItem>
 </Menu>
 
 <style lang="scss">

src/routes/features/maintenance/[id]/delete/+page.svelte

@@ -0,0 +1,41 @@
+<script>
+    import { goto } from "$app/navigation";
+    import Menu from "$components/ui/menu/Menu.svelte";
+    import MenuItem from "$components/ui/menu/MenuItem.svelte";
+    import { page } from "$app/stores";
+    import { maintenanceProfilesStore } from "$stores/maintenance-profiles-store.js";
+
+    const profileId = $page.params.id;
+    const targetProfile = $maintenanceProfilesStore.find(profile => profile.id===profileId);
+
+    if (!targetProfile) {
+        void goto('/features/maintenance');
+    }
+
+    async function deleteProfile() {
+        if (!targetProfile) {
+            console.warn('Attempting to delete the profile, but the profile is not loaded yet.');
+            return;
+        }
+
+        await targetProfile.delete();
+        await goto('/features/maintenance');
+    }
+</script>
+
+<Menu>
+    <MenuItem icon="arrow-left" href="/features/maintenance/{profileId}">Back</MenuItem>
+    <hr>
+</Menu>
+{#if targetProfile}
+    <p>
+        Do you want to remove profile "{targetProfile.settings.name}"? This action is irreversible.
+    </p>
+    <Menu>
+        <hr>
+        <MenuItem on:click={deleteProfile}>Yes</MenuItem>
+        <MenuItem href="/features/maintenance/{profileId}">No</MenuItem>
+    </Menu>
+{:else}
+    <p>Loading...</p>
+{/if}

src/routes/features/maintenance/[id]/edit/+page.svelte

@@ -46,16 +46,6 @@
         await targetProfile.save();
         await goto('/features/maintenance/' + targetProfile.id);
     }
-
-    async function deleteProfile() {
-        if (!targetProfile) {
-            console.warn('Attempting to delete the profile, but the profile is not loaded yet.');
-            return;
-        }
-
-        await targetProfile.delete();
-        await goto('/features/maintenance');
-    }
 </script>
 
 <Menu>
@@ -75,7 +65,4 @@
 <Menu>
     <hr>
     <MenuItem href="#" on:click={saveProfile}>Save Profile</MenuItem>
-    {#if profileId !== 'new'}
-        <MenuItem href="#" on:click={deleteProfile}>Delete Profile</MenuItem>
-    {/if}
 </Menu>

src/styles/injectable/icons.scss

@@ -1,6 +1,6 @@
-@mixin insert-icon($icon_src) {
-  mask-image: url($icon_src);
-  -webkit-mask-image: url($icon_src);
+@mixin insert-icon($url) {
+  mask-image: $url;
+  -webkit-mask-image: $url;
 }
 
 .icon {
@@ -11,33 +11,37 @@
 }
 
 .icon.icon-tag {
-  @include insert-icon('/img/tag.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/tag.svg'));
 }
 
 .icon.icon-paint-brush {
-  @include insert-icon('/img/paint-brush.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/paintbrush.svg'));
 }
 
 .icon.icon-arrow-left {
-  @include insert-icon('/img/arrow-left.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/arrow-left.svg'));
 }
 
 .icon.icon-info-circle {
-  @include insert-icon('/img/info-circle.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/circle-info.svg'));
 }
 
 .icon.icon-wrench {
-  @include insert-icon('/img/wrench.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/wrench.svg'));
 }
 
 .icon.icon-globe {
-  @include insert-icon('/img/globe.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/globe.svg'));
 }
 
 .icon.icon-plus {
-  @include insert-icon('/img/plus.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/plus.svg'));
 }
 
 .icon.icon-file-export {
-  @include insert-icon('/img/file-export.svg');
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/file-export.svg'));
+}
+
+.icon.icon-trash {
+  @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/trash.svg'));
 }