i messed up the merge a bit but it should be okay

package.json

@@ -21,12 +21,12 @@
 		"@untitled-theme/icons-solid": "^0.6.0",
 		"solid-js": "^1.8.15",
 		"solid-transition-group": "^0.2.3",
-        "uuid": "^9.0.1"
+		"uuid": "^9.0.1"
 	},
 	"devDependencies": {
 		"@flowr/eslint-config": "^2.2.1",
 		"@tauri-apps/cli": "2.0.0-beta.9",
-        "@types/uuid": "^9.0.8",
+		"@types/uuid": "^9.0.8",
 		"autoprefixer": "^10.4.18",
 		"eslint": "^8.57.0",
 		"eslint-plugin-solid": "^0.13.1",

pnpm-lock.yaml

@@ -37,9 +37,9 @@ devDependencies:
   '@tauri-apps/cli':
     specifier: 2.0.0-beta.9
     version: 2.0.0-beta.9
-  '@typescript-eslint/parser':
+  '@types/uuid':
-    specifier: ^7.2.0
+    specifier: ^9.0.8
-    version: 7.2.0(eslint@8.57.0)(typescript@5.4.2)
+    version: 9.0.8
   autoprefixer:
     specifier: ^10.4.18
     version: 10.4.18(postcss@8.4.35)
@@ -1165,6 +1165,14 @@ packages:
     resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==}
     dev: true
 
+  /@types/unist@2.0.10:
+    resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==}
+    dev: true
+
+  /@types/uuid@9.0.8:
+    resolution: {integrity: sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==}
+    dev: true
+
   /@typescript-eslint/eslint-plugin@7.2.0(@typescript-eslint/parser@7.2.0)(eslint@8.57.0)(typescript@5.4.2):
     resolution: {integrity: sha512-mdekAHOqS9UjlmyF/LSs6AIEvfceV749GFxoBAjwAv0nkevfKHWQFDMcBZWUiIC5ft6ePWivXoS36aKQ0Cy3sw==}
     engines: {node: ^16.0.0 || >=18.0.0}
@@ -2042,7 +2050,7 @@ packages:
       safe-array-concat: 1.1.2
       safe-regex-test: 1.0.3
       string.prototype.trim: 1.2.8
-      string.prototype.trimend: 1.0.7
+      string.prototype.trimend: 1.0.8
       string.prototype.trimstart: 1.0.7
       typed-array-buffer: 1.0.2
       typed-array-byte-length: 1.0.1
@@ -2093,7 +2101,7 @@ packages:
       safe-array-concat: 1.1.2
       safe-regex-test: 1.0.3
       string.prototype.trim: 1.2.8
-      string.prototype.trimend: 1.0.7
+      string.prototype.trimend: 1.0.8
       string.prototype.trimstart: 1.0.7
       typed-array-buffer: 1.0.2
       typed-array-byte-length: 1.0.1
@@ -2135,6 +2143,13 @@ packages:
       safe-array-concat: 1.1.2
     dev: true
 
+  /es-object-atoms@1.0.0:
+    resolution: {integrity: sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==}
+    engines: {node: '>= 0.4'}
+    dependencies:
+      es-errors: 1.3.0
+    dev: true
+
   /es-set-tostringtag@2.0.3:
     resolution: {integrity: sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==}
     engines: {node: '>= 0.4'}
@@ -4455,12 +4470,12 @@ packages:
       es-abstract: 1.22.5
     dev: true
 
-  /string.prototype.trimend@1.0.7:
+  /string.prototype.trimend@1.0.8:
-    resolution: {integrity: sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==}
+    resolution: {integrity: sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==}
     dependencies:
       call-bind: 1.0.7
       define-properties: 1.2.1
-      es-abstract: 1.22.5
+      es-object-atoms: 1.0.0
     dev: true
 
   /string.prototype.trimstart@1.0.7:

src/types/game.d.ts

@@ -1,3 +1,3 @@
 declare namespace game {
-    export type Client = 'fabric' | 'forge' | 'quilt' | 'vanilla' | 'other';
+	export type Client = 'fabric' | 'forge' | 'quilt' | 'vanilla' | 'other';
 }

src/ui/pages/Home.tsx

@@ -2,7 +2,6 @@ import {
 	CheckIcon,
 	DotsVerticalIcon,
 	Download01Icon,
-	HeartRoundedIcon,
 	PlayIcon,
 	PlusIcon,
 	SearchMdIcon,
@@ -128,76 +127,6 @@ function InstanceGroup(props: InstanceGroupProps) {
 	);
 }
 
-interface InstanceCardProps {
-	name: string;
-	version: string;
-	client: game.Client;
-	mods?: number;
-	cover?: string;
-	lastPlayed?: number;
-}
-
-function InstanceCard(props: InstanceCardProps) {
-	return (
-		<div class="h-[152px] group flex flex-col rounded-xl bg-component-bg hover:bg-component-bg-hover active:bg-component-bg-pressed border border-gray-.5 overflow-hidden">
-			<div class="flex-1 relative overflow-hidden">
-				<div class="absolute h-full w-full group-hover:scale-110 transition-transform">
-					<img
-						class={`object-cover h-full w-full ${props.cover ? '' : ' filter grayscale'}`}
-						src={props.cover || defaultCover}
-					/>
-				</div>
-			</div>
-			<div class="z-10 p-3 flex flex-row items-center justify-between">
-				<div class="flex flex-col gap-1.5">
-					<p class="h-4 font-semibold">{props.name}</p>
-					<p class="h-4 text-xs">
-						{upperFirst(props.client)}
-						{' '}
-						{props.version}
-						{' '}
-						{props.mods && `• ${props.mods} mods`}
-					</p>
-				</div>
-				<Button styleType="icon" class="w-8 h-8">
-					<DotsVerticalIcon />
-				</Button>
-			</div>
-		</div>
-	);
-}
-
-interface InstanceGroupProps {
-	title: string;
-	instances: InstanceCardProps[];
-}
-
-function InstanceGroup(props: InstanceGroupProps) {
-	const [sorted, setSorted] = createSignal<InstanceCardProps[]>([]);
-
-	createEffect(() => {
-		setSorted(props.instances.sort((a, b) => {
-			if (a.lastPlayed && b.lastPlayed)
-				return b.lastPlayed - a.lastPlayed;
-
-			return 0;
-		}));
-	});
-
-	return (
-		<div class="flex flex-col gap-y-4">
-			<h4>{props.title}</h4>
-			<div class="grid grid-cols-4 gap-4">
-				<For each={sorted()}>
-					{instance => (
-						<InstanceCard {...instance} />
-					)}
-				</For>
-			</div>
-		</div>
-	);
-}
-
 function HomePage() {
 	const myInstances: InstanceCardProps[] = [
 		{

src/utils/string.ts

@@ -1,7 +1,7 @@
 export function upperFirst(str: string): string {
-    return str.charAt(0).toUpperCase() + str.slice(1);
+	return str.charAt(0).toUpperCase() + str.slice(1);
 }
 
 export default {
-    upperFirst,
+	upperFirst,
 };