diff --git a/theseus_gui/package.json b/theseus_gui/package.json
index a5f51b3e0..6797f2b76 100644
--- a/theseus_gui/package.json
+++ b/theseus_gui/package.json
@@ -18,7 +18,7 @@
     "floating-vue": "^2.0.0-beta.20",
     "mixpanel-browser": "^2.47.0",
     "ofetch": "^1.0.1",
-    "omorphia": "^0.4.31",
+    "omorphia": "^0.4.33",
     "pinia": "^2.1.3",
     "tauri-plugin-window-state-api": "github:tauri-apps/tauri-plugin-window-state#v1",
     "vite-svg-loader": "^4.0.0",
@@ -38,5 +38,5 @@
     "vite": "^4.3.9",
     "vite-plugin-eslint": "^1.8.1"
   },
-  "packageManager": "pnpm@8.5.1"
+  "packageManager": "pnpm@8.6.0"
 }
diff --git a/theseus_gui/pnpm-lock.yaml b/theseus_gui/pnpm-lock.yaml
index 251c9dac2..1051f77d7 100644
--- a/theseus_gui/pnpm-lock.yaml
+++ b/theseus_gui/pnpm-lock.yaml
@@ -1,4 +1,8 @@
-lockfileVersion: '6.0'
+lockfileVersion: '6.1'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
 
 dependencies:
   '@tauri-apps/api':
@@ -17,14 +21,14 @@ dependencies:
     specifier: ^1.0.1
     version: 1.0.1
   omorphia:
-    specifier: ^0.4.31
-    version: 0.4.31
+    specifier: ^0.4.33
+    version: 0.4.33
   pinia:
     specifier: ^2.1.3
     version: 2.1.3(vue@3.3.4)
   tauri-plugin-window-state-api:
     specifier: github:tauri-apps/tauri-plugin-window-state#v1
-    version: github.com/tauri-apps/tauri-plugin-window-state/56fd671f8d5ac2d8b826a358af486f220a125c3d
+    version: github.com/tauri-apps/tauri-plugin-window-state/347c792535d2623fc21f66590d06f4c8dadd85ba
   vite-svg-loader:
     specifier: ^4.0.0
     version: 4.0.0
@@ -409,6 +413,11 @@ packages:
     engines: {node: '>= 14.6.0', npm: '>= 6.6.0', yarn: '>= 1.19.1'}
     dev: false
 
+  /@tauri-apps/api@1.4.0:
+    resolution: {integrity: sha512-Jd6HPoTM1PZSFIzq7FB8VmMu3qSSyo/3lSwLpoapW+lQ41CL5Dow2KryLg+gyazA/58DRWI9vu/XpEeHK4uMdw==}
+    engines: {node: '>= 14.6.0', npm: '>= 6.6.0', yarn: '>= 1.19.1'}
+    dev: false
+
   /@tauri-apps/cli-darwin-arm64@1.3.1:
     resolution: {integrity: sha512-QlepYVPgOgspcwA/u4kGG4ZUijlXfdRtno00zEy+LxinN/IRXtk+6ErVtsmoLi1ZC9WbuMwzAcsRvqsD+RtNAg==}
     engines: {node: '>= 10'}
@@ -1336,13 +1345,14 @@ packages:
       ufo: 1.1.2
     dev: false
 
-  /omorphia@0.4.31:
-    resolution: {integrity: sha512-xeb9bD42VFRDKCkKz678hBYCIS//Atd4/hx6/YmboJLMEIjIJfS2Ocf9G53G52XkfS4DWs9CIzKz71NDh86kxQ==}
+  /omorphia@0.4.33:
+    resolution: {integrity: sha512-Wo0t16zRL8ZLJSKVAYv6pdYhL4YXYjDYs18shO7V5cfxjcynvd5j0sui6uBR8ghVMWFEJH994AEC/urLwcHiBA==}
     dependencies:
       dayjs: 1.11.7
       floating-vue: 2.0.0-beta.20(vue@3.3.4)
       highlight.js: 11.8.0
       markdown-it: 13.0.1
+      qrcode.vue: 3.4.0(vue@3.3.4)
       vue: 3.3.4
       vue-router: 4.2.1(vue@3.3.4)
       vue-select: 4.0.0-beta.6(vue@3.3.4)
@@ -1460,6 +1470,14 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
+  /qrcode.vue@3.4.0(vue@3.3.4):
+    resolution: {integrity: sha512-4XeImbv10Fin16Fl2DArCMhGyAdvIg2jb7vDT+hZiIAMg/6H6mz9nUZr/dR8jBcun5VzNzkiwKhiqOGbloinwA==}
+    peerDependencies:
+      vue: ^3.0.0
+    dependencies:
+      vue: 3.3.4
+    dev: false
+
   /queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
     dev: true
@@ -1791,10 +1809,10 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  github.com/tauri-apps/tauri-plugin-window-state/56fd671f8d5ac2d8b826a358af486f220a125c3d:
-    resolution: {tarball: https://codeload.github.com/tauri-apps/tauri-plugin-window-state/tar.gz/56fd671f8d5ac2d8b826a358af486f220a125c3d}
+  github.com/tauri-apps/tauri-plugin-window-state/347c792535d2623fc21f66590d06f4c8dadd85ba:
+    resolution: {tarball: https://codeload.github.com/tauri-apps/tauri-plugin-window-state/tar.gz/347c792535d2623fc21f66590d06f4c8dadd85ba}
     name: tauri-plugin-window-state-api
     version: 0.0.0
     dependencies:
-      '@tauri-apps/api': 1.3.0
+      '@tauri-apps/api': 1.4.0
     dev: false
diff --git a/theseus_gui/src/assets/external/github.svg b/theseus_gui/src/assets/external/github.svg
new file mode 100644
index 000000000..2f0f9348f
--- /dev/null
+++ b/theseus_gui/src/assets/external/github.svg
@@ -0,0 +1 @@
+<svg height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg"><path d="m16 .396c-8.839 0-16 7.167-16 16 0 7.073 4.584 13.068 10.937 15.183.803.151 1.093-.344 1.093-.772 0-.38-.009-1.385-.015-2.719-4.453.964-5.391-2.151-5.391-2.151-.729-1.844-1.781-2.339-1.781-2.339-1.448-.989.115-.968.115-.968 1.604.109 2.448 1.645 2.448 1.645 1.427 2.448 3.744 1.74 4.661 1.328.14-1.031.557-1.74 1.011-2.135-3.552-.401-7.287-1.776-7.287-7.907 0-1.751.62-3.177 1.645-4.297-.177-.401-.719-2.031.141-4.235 0 0 1.339-.427 4.4 1.641 1.281-.355 2.641-.532 4-.541 1.36.009 2.719.187 4 .541 3.043-2.068 4.381-1.641 4.381-1.641.859 2.204.317 3.833.161 4.235 1.015 1.12 1.635 2.547 1.635 4.297 0 6.145-3.74 7.5-7.296 7.891.556.479 1.077 1.464 1.077 2.959 0 2.14-.02 3.864-.02 4.385 0 .416.28.916 1.104.755 6.4-2.093 10.979-8.093 10.979-15.156 0-8.833-7.161-16-16-16z"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/external/index.js b/theseus_gui/src/assets/external/index.js
index b7aff27d4..2ac283e18 100644
--- a/theseus_gui/src/assets/external/index.js
+++ b/theseus_gui/src/assets/external/index.js
@@ -4,3 +4,7 @@ export { default as KoFiIcon } from './kofi.svg'
 export { default as PatreonIcon } from './patreon.svg'
 export { default as PaypalIcon } from './paypal.svg'
 export { default as OpenCollectiveIcon } from './opencollective.svg'
+export { default as TwitterIcon } from './twitter.svg'
+export { default as GithubIcon } from './github.svg'
+export { default as MastodonIcon } from './mastodon.svg'
+export { default as RedditIcon } from './reddit.svg'
diff --git a/theseus_gui/src/assets/external/mastodon.svg b/theseus_gui/src/assets/external/mastodon.svg
new file mode 100644
index 000000000..9e96c9410
--- /dev/null
+++ b/theseus_gui/src/assets/external/mastodon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M480,173.59c0-104.13-68.26-134.65-68.26-134.65C377.3,23.15,318.2,16.5,256.8,16h-1.51c-61.4.5-120.46,7.15-154.88,22.94,0,0-68.27,30.52-68.27,134.65,0,23.85-.46,52.35.29,82.59C34.91,358,51.11,458.37,145.32,483.29c43.43,11.49,80.73,13.89,110.76,12.24,54.47-3,85-19.42,85-19.42l-1.79-39.5s-38.93,12.27-82.64,10.77c-43.31-1.48-89-4.67-96-57.81a108.44,108.44,0,0,1-1-14.9,558.91,558.91,0,0,0,96.39,12.85c32.95,1.51,63.84-1.93,95.22-5.67,60.18-7.18,112.58-44.24,119.16-78.09C480.84,250.42,480,173.59,480,173.59ZM399.46,307.75h-50V185.38c0-25.8-10.86-38.89-32.58-38.89-24,0-36.06,15.53-36.06,46.24v67H231.16v-67c0-30.71-12-46.24-36.06-46.24-21.72,0-32.58,13.09-32.58,38.89V307.75h-50V181.67q0-38.65,19.75-61.39c13.6-15.15,31.4-22.92,53.51-22.92,25.58,0,44.95,9.82,57.75,29.48L256,147.69l12.45-20.85c12.81-19.66,32.17-29.48,57.75-29.48,22.11,0,39.91,7.77,53.51,22.92Q399.5,143,399.46,181.67Z"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/external/reddit.svg b/theseus_gui/src/assets/external/reddit.svg
new file mode 100644
index 000000000..5cfd11243
--- /dev/null
+++ b/theseus_gui/src/assets/external/reddit.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" enable-background="new 0 0 100 100" height="512" viewBox="0 0 100 100" width="512" xmlns="http://www.w3.org/2000/svg"><g id="_x33_2.Reddit"><path id="Icon_69_" d="m90 50.6c-.2-4.8-4.2-8.6-9.1-8.5-2.2.1-4.2 1-5.7 2.4-6.8-4.7-14.9-7.2-23.2-7.4l3.9-18.7 12.9 2.6c.4 3.3 3.3 5.7 6.6 5.3s5.7-3.3 5.3-6.6-3.3-5.7-6.6-5.3c-1.9.2-3.6 1.3-4.5 2.9l-14.7-2.9c-1-.2-2 .4-2.2 1.4l-4.4 20.9c-8.4.1-16.5 2.7-23.5 7.4-3.5-3.3-9.1-3.2-12.4.4-3.3 3.5-3.2 9.1.4 12.4.7.6 1.5 1.2 2.4 1.6-.1.9-.1 1.8 0 2.6 0 13.5 15.7 24.5 35.1 24.5s35.1-10.9 35.1-24.5c.1-.9.1-1.8 0-2.6 2.8-1.4 4.7-4.5 4.6-7.9zm-60.3 6.1c0-3.3 2.7-6 6-6s6 2.7 6 6-2.7 6-6 6-6-2.7-6-6zm35 16.6c-4.3 3.2-9.5 4.9-14.8 4.6-5.3.2-10.6-1.4-14.8-4.6-.6-.7-.5-1.7.2-2.3.6-.5 1.4-.5 2.1 0 3.6 2.6 8 4 12.5 3.8 4.5.2 8.9-1 12.6-3.7.7-.6 1.7-.6 2.4 0 .6.7.6 1.7 0 2.4v-.2zm-1-10.3c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6c.1 3.3-2.4 6.1-5.8 6.2-.1 0-.2 0-.3 0z"/></g></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/external/twitter.svg b/theseus_gui/src/assets/external/twitter.svg
new file mode 100644
index 000000000..a43d68d9f
--- /dev/null
+++ b/theseus_gui/src/assets/external/twitter.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/add-project.svg b/theseus_gui/src/assets/icons/add-project.svg
new file mode 100644
index 000000000..8a1665368
--- /dev/null
+++ b/theseus_gui/src/assets/icons/add-project.svg
@@ -0,0 +1,121 @@
+<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" width="786.42633" height="652.03428"
+     viewBox="0 0 786.42633 652.03428" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path
+    d="M903.54736,730.85043l13.83594,12.73764-10.99575-18.45c8.663-15.70975,22.83131-29.2868,22.83131-29.2868s29.39425,28.162,29.39425,50.2992-13.16018,29.86665-29.39425,29.86665c-16.23381,0-29.394-7.72947-29.394-29.86665A38.833,38.833,0,0,1,903.54736,730.85043Z"
+    transform="translate(-206.78683 -123.98286)" fill="#f2f2f2"/>
+  <path
+    d="M920.94151,744.27764v1.09115c.06482,12.6836,2.20394,22.57981,6.4012,29.54819.05941.10264.12423.19987.18367.30251l.47-.28628.44833-.28091c-4.6564-7.52479-6.304-18.16106-6.36337-29.22406-.00541-.35654-.01082-.71846-.00541-1.08037.01622-4.68344.3025-9.42085.76165-14.02325.03241-.35654.07023-.71846.108-1.08037.63742-6.07169,1.55574-11.87328,2.49566-16.91323.06482-.35654.135-.713.20527-1.06418,1.626-8.52412,3.28434-14.69845,3.66248-16.06513.04319-.16746.07023-.25928.07564-.28088l-.51319-.14586-.00541-.00541-.51859-.14586c-.0054.02163-.09723.32954-.24846.90214-.578,2.13911-2.07974,7.94611-3.55443,15.606-.06482.34573-.135.70227-.19987,1.05878-.76706,4.08921-1.51792,8.6592-2.11215,13.456q-.22684,1.807-.40514,3.56525c-.04319.36191-.081.72383-.11341,1.08037Q920.96848,737.75491,920.94151,744.27764Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M916.40934,708.70636q-.33223.42946-.68064.8751a29.8087,29.8087,0,0,0,8.616,2.60911c.36191.054.72924.10263,1.09656.14045a30.83387,30.83387,0,0,0,3.25193.17286,30.06183,30.06183,0,0,0,13.21834-3.04665c-.23227-.29169-.45914-.578-.686-.86429a28.98836,28.98836,0,0,1-12.53233,2.83057,29.80237,29.80237,0,0,1-3.04666-.15667c-.37273-.03779-.74-.08642-1.102-.135A28.88877,28.88877,0,0,1,916.40934,708.70636Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M906.22144,723.71816c-.17827.31869-.35113.63741-.524.9561a30.06438,30.06438,0,0,0,16.01654,5.61795c.37272.01619.74545.027,1.12356.03241.15127.00541.3025.00541.45377.00541a30.22423,30.22423,0,0,0,24.56225-12.61337c-.21065-.3241-.42674-.64282-.64279-.96151a29.14214,29.14214,0,0,1-23.91946,12.49451c-.11345,0-.23228,0-.34573-.00541q-.55909,0-1.11819-.03241A28.94206,28.94206,0,0,1,906.22144,723.71816Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M901.38136,734.44624c-.12964.39974-.25928.79406-.37273,1.1938a30.2024,30.2024,0,0,0,19.93288,9.72875c.37811.027.75624.04863,1.13979.05945.39973.02159.80487.027,1.21.027a30.291,30.291,0,0,0,28.7325-20.79717c-.23227-.43755-.47536-.86969-.71845-1.30727a29.221,29.221,0,0,1-28.014,21.02407c-.40514,0-.81028-.01081-1.21542-.027-.37814-.01622-.75627-.03782-1.13438-.07023A29.12666,29.12666,0,0,1,901.38136,734.44624Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M316.94925,355.76722l-18.42885,3.74943,18.95117-10.10747c.70712-17.92608-4.40075-36.873-4.40075-36.873s-39.72111,8.90812-51.16667,27.85684-4.17722,32.36909,9.71863,40.76257c13.89562,8.39335,29.15667,8.58136,40.60223-10.36737A38.83288,38.83288,0,0,0,316.94925,355.76722Z"
+    transform="translate(-206.78683 -123.98286)" fill="#f2f2f2"/>
+  <path
+    d="M295.11815,358.26721l-.56415.934c-6.61327,10.82324-13.56091,18.1881-20.75648,21.98271-.10392.05714-.20968.10685-.31363.164l-.25425-.488-.23852-.47225c7.87626-4.03349,14.78578-12.286,20.55652-21.72482.189-.30239.38072-.60938.56321-.922,2.40759-4.01726,4.61192-8.22034,6.59848-12.39724.1566-.322.31135-.65129.4661-.98063,2.59363-5.52673,4.80716-10.96751,6.60842-15.76751.12885-.3387.25307-.68017.3745-1.017,3.01544-8.137,4.78823-14.27949,5.17117-15.64484.04961-.16567.07394-.25825.08048-.27953l.51468.14048.00743-.00183.51931.14327c-.00656.02131-.08716.33235-.25375.90066-.61124,2.12986-2.32819,7.87691-5.02625,15.196-.12326.32944-.24749.67094-.37633,1.00961-1.45767,3.89683-3.17777,8.19681-5.14922,12.61q-.74007,1.664-1.49655,3.26121c-.15015.33212-.3049.66146-.4615.9834Q298.46752,352.67,295.11815,358.26721Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M309.17142,328.03255c-.33493-.1455-.67449-.29379-1.01307-.45416a29.79906,29.79906,0,0,1-2.68885-1.4411,28.98824,28.98824,0,0,1-9.26378-8.90245c-.34221.12775-.68443.25553-1.03407.38512a30.06182,30.06182,0,0,0,9.73927,9.4421,30.83323,30.83323,0,0,0,2.87293,1.53337c.334.15755.67353.30584,1.01124.44673a29.80847,29.80847,0,0,0,8.724,2.2214q-.06781-.5616-.13015-1.101A28.88891,28.88891,0,0,1,309.17142,328.03255Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M302.14932,344.91334q-.49531-.26135-.97389-.5504c-.09991-.054-.20162-.11546-.29873-.17412a29.14213,29.14213,0,0,1-14.01428-23.062c-.34971.16109-.69946.32218-1.04733.49069a30.22425,30.22425,0,0,0,14.503,23.496c.12948.07821.25893.1564.39121.23.32644.19086.65107.37432.97849.55317A30.06442,30.06442,0,0,0,318.3021,349.369c.01681-.36216.03363-.72436.04581-1.08932A28.942,28.942,0,0,1,302.14932,344.91334Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M295.11815,358.26721c-.3404-.16775-.67524-.34477-1.0073-.5264-.35515-.19561-.70753-.39582-1.05432-.60529a29.221,29.221,0,0,1-13.10908-32.48c-.43432.24888-.86583.49309-1.29088.74753A30.291,30.291,0,0,0,292.498,358.06029c.34679.20946.69637.4143,1.04969.60249.33389.18905.66873.36607,1.00636.53842a30.20241,30.20241,0,0,0,22.092,1.97836c.10957-.40081.20248-.80537.29818-1.21455A29.12672,29.12672,0,0,1,295.11815,358.26721Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M627.60982,162.34l-1.50044,21.17374,8.53985-22.68841c19.95913-3.4137,41.91143-.46871,41.91143-.46871s-4.15923,45.75834-23.692,61.33993-35.61589,9.41018-47.04249-4.914c-11.42641-14.32393-13.86928-31.37635,5.6635-46.95793C615.83726,166.35645,621.47447,163.96518,627.60982,162.34Z"
+    transform="translate(-206.78683 -123.98286)" fill="#f2f2f2"/>
+  <path
+    d="M628.00544,187.13868l-.96278.768c-11.14577,8.98473-18.37207,17.83778-21.56633,26.446-.04875.12467-.08891.2503-.13763.375l.58339.21317.56342.19786c3.362-9.405,11.5873-18.34524,21.307-26.18453.31079-.25572.62632-.51524.94946-.7652,4.14386-3.2822,8.52543-6.3641,12.90954-9.19843.3374-.22236.68336-.44374,1.02931-.66511,5.806-3.71122,11.57145-6.98448,16.68-9.70258.36022-.19376.72421-.38273,1.08347-.56792,8.66573-4.56515,15.28093-7.44777,16.753-8.07609.17815-.07975.2782-.12053.30106-.131l-.23251-.55547.001-.00858-.23632-.56024c-.02289.01045-.3592.14616-.97088.41574-2.29429.99565-8.47513,3.75794-16.27179,7.84823-.35068.18615-.7147.37514-1.07489.56888-4.148,2.20144-8.70888,4.75557-13.35962,7.60757q-1.754,1.07169-3.431,2.152c-.34974.21663-.6957.438-1.0331.66037Q633.77978,182.57135,628.00544,187.13868Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M656.20179,158.10233q-.61279.00914-1.25122.01539a33.64476,33.64476,0,0,0,3.76233,9.43878c.20709.35735.42272.71569.6479,1.06641a34.80164,34.80164,0,0,0,2.13639,2.991,33.93068,33.93068,0,0,0,11.99215,9.51879c.09388-.41025.18683-.812.27975-1.21364a32.71933,32.71933,0,0,1-11.31863-9.06558,33.63269,33.63269,0,0,1-2.00619-2.79851c-.229-.35547-.44465-.71381-.65648-1.06737A32.607,32.607,0,0,1,656.20179,158.10233Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M635.78519,159.67929c-.40667.067-.80957.13883-1.21244.21062a33.93381,33.93381,0,0,0,6.31647,18.0865c.24806.34027.50087.67676.76224,1.01419.1017.13727.20815.27072.31462.40419A34.1142,34.1142,0,0,0,670.384,192.18923c.13771-.414.26684-.829.396-1.24394a32.8928,32.8928,0,0,1-27.86062-12.31094c-.07986-.1001-.16349-.205-.23858-.30886q-.39353-.49332-.75845-1.00945A32.66688,32.66688,0,0,1,635.78519,159.67929Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M622.91248,162.95976c-.44395.167-.88314.33014-1.31569.51139a34.08954,34.08954,0,0,0,5.44587,24.43555c.24227.35265.48938.7015.7498,1.04753.2623.36791.54269.72919.82786,1.08667a34.18957,34.18957,0,0,0,38.57422,10.71378c.22258-.51293.43278-1.03159.64778-1.55408a32.98177,32.98177,0,0,1-38.26873-9.92014c-.28517-.35748-.56079-.72256-.83167-1.09143-.25184-.34507-.499-.69392-.73648-1.05035A32.87538,32.87538,0,0,1,622.91248,162.95976Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <path
+    d="M403.58115,548.93076c-2.00945,0-4.0394-.03183-6.03187-.09407l.04526-1.44715c2.861.08913,5.78078.11388,8.65526.07427l.01981,1.44856Q404.92747,548.9304,403.58115,548.93076Zm11.40383-.336-.08487-1.44573c2.86528-.169,5.76734-.4067,8.62555-.70589l.15138,1.44007c-2.88015.302-5.80414.5418-8.69208.71155Zm-26.1433-.22563c-2.88933-.22139-5.80908-.51138-8.6786-.86362l.17683-1.43724c2.84759.3487,5.7447.63728,8.61211.85655Zm43.48494-1.59285-.21714-1.43158c2.84689-.43216,5.71571-.93363,8.5244-1.4917l.28222,1.42027C438.08547,545.83556,435.19544,546.34132,432.32662,546.77631Zm-60.79227-.52977c-2.85432-.48383-5.73552-1.03973-8.56331-1.65367l.30732-1.416c2.80622.6097,5.66514,1.16139,8.49788,1.64094Zm77.89484-2.86952-.348-1.40612c2.79456-.691,5.60467-1.45492,8.35254-2.26973l.41165,1.38919C455.07629,541.91149,452.245,542.681,449.42919,543.377Zm-94.93552-.83037c-2.79986-.74479-5.6174-1.56385-8.37446-2.436l.4364-1.38066c2.7362.865,5.53217,1.67772,8.3101,2.41615ZM466.147,538.41742l-.4753-1.36793c2.71179-.94283,5.43915-1.962,8.1078-3.03008l.53755,1.34529C471.62858,536.44051,468.88,537.46751,466.147,538.41742Zm-128.3025-1.13452c-2.71922-.99941-5.45542-2.07805-8.13185-3.20549l.5623-1.33539c2.65592,1.119,5.3709,2.1891,8.06961,3.18145Zm144.475-5.33659-.59979-1.31841c2.60428-1.18332,5.222-2.44656,7.78032-3.75436l.65921,1.29012C487.58107,529.4814,484.94354,530.7538,482.31945,531.94631Zm15.49841-7.92249-.71721-1.25759c2.49748-1.42521,4.99073-2.92328,7.409-4.45317l.77379,1.22363C502.84677,521.07861,500.33514,522.5887,497.81786,524.02382Zm14.71966-9.31235-.829-1.18685c2.35178-1.64306,4.69861-3.36393,6.97542-5.11379l.88271,1.14865C517.27291,511.32279,514.90769,513.05639,512.53752,514.71147Zm-220.77838-2.03986c-2.338-1.69823-4.6735-3.47709-6.9422-5.28849l.9039-1.13169c2.25134,1.79726,4.56917,3.56268,6.88912,5.24748ZM526.35467,504.092l-.93364-1.10764c2.19193-1.84959,4.37325-3.777,6.48455-5.72914l.98315,1.06378C530.76187,500.28605,528.56358,502.22825,526.35467,504.092ZM278.1245,501.78482c-2.17743-1.90689-4.34072-3.89016-6.42938-5.89537l1.003-1.04539c2.0731,1.99031,4.21977,3.95877,6.38057,5.85151Zm261.03026-9.53231-1.03124-1.0171c2.02072-2.04764,4.0196-4.16672,5.93992-6.29782l1.07652.969c-1.93523,2.14808-3.94892,4.28276-5.98524,6.34592Zm-273.61244-2.54346c-1.99777-2.10069-3.97079-4.27211-5.86424-6.45343l1.0942-.9492c1.87894,2.16505,3.83676,4.3195,5.81968,6.40392Zm285.28784-10.415-1.11895-.91949c1.82554-2.22164,3.6228-4.514,5.34366-6.81486l1.16.86716C554.48125,474.74536,552.66985,477.05612,550.83016,479.294Zm-296.71541-2.75c-1.794-2.2669-3.56055-4.60737-5.25066-6.95632l1.1755-.846c1.67737,2.33056,3.43042,4.65334,5.21105,6.904Zm307.1658-11.22422-1.19817-.81336c1.61548-2.37865,3.19767-4.82663,4.70214-7.27743l1.23495.75823C564.50231,460.45644,562.90805,462.92351,561.28055,465.31981Zm-317.34282-2.91833c-1.57834-2.41968-3.12308-4.90939-4.59181-7.40192l1.24769-.73559c1.45775,2.47339,2.99082,4.94475,4.55714,7.34533Zm326.47975-11.95832-1.26749-.70022c1.39056-2.51659,2.74151-5.10111,4.01677-7.682l1.29865.64223C573.18091,445.3032,571.81864,447.90744,570.41748,450.44316Zm7.73576-15.65967-1.32685-.5814c1.15432-2.63612,2.26266-5.33589,3.29461-8.02364l1.35236.51916C580.43359,429.40656,579.31605,432.12684,578.15324,434.78349Zm-350.47957-3.12557c-1.11047-2.66511-2.17389-5.39176-3.16058-8.105l1.36156-.49511c.9789,2.6927,2.0342,5.39813,3.13582,8.04273Zm356.74344-13.1933-1.375-.45551c.90388-2.72382,1.75693-5.50776,2.535-8.27543l1.3948.39182C586.18749,412.91439,585.32741,415.72028,584.41711,418.46462Zm-362.69433-3.17438c-.86185-2.7606-1.67171-5.58061-2.40695-8.38294l1.40117-.3678c.72958,2.78111,1.53343,5.57991,2.38856,8.31929ZM589.13835,401.6775l-1.41106-.32818c.64859-2.79173,1.24131-5.64284,1.76259-8.47278l1.42451.2617C590.38957,395.99077,589.7919,398.86313,589.13835,401.6775Zm-371.8397-3.255c-.60405-2.82921-1.15078-5.71147-1.62467-8.56826l1.42875-.23765c.47071,2.83555,1.01321,5.6959,1.61265,8.50318Zm374.99644-13.89425-1.43583-.19663c.38973-2.837.71862-5.72985.9782-8.59867l1.4429.13014c-.26175,2.89143-.59347,5.80625-.98532,8.66514ZM214.444,381.22091c-.34163-2.86743-.62207-5.78785-.83391-8.68l1.445-.1061c.20971,2.87094.48839,5.76876.82754,8.61494Zm379.42627-14.05763-1.44714-.06507c.12873-2.87024.19451-5.78149.19451-8.65243h1.44855c0,2.89284-.06582,5.82605-.196,8.71748Zm-380.69906-3.33281c-.04951-1.776-.0746-3.58815-.075-5.38469q0-1.672.02865-3.33776l1.44856.02546q-.02865,1.653-.02865,3.3123c.00035,1.78311.02546,3.58178.07427,5.34508Zm1.746-17.34482-1.44572-.09053c.18071-2.89429.43038-5.81757.74125-8.68886l1.44007.156c-.30878,2.84972-.556,5.75072-.73565,8.62343Zm376.76514-8.83734c-.28929-2.85574-.68723-4.2481-1.10737-7.09146l1.433-.21148c.423,2.86492.78586,5.0519,1.07793,7.92921Zm-374.90175-8.36637-1.43158-.22139c.44383-2.86563.95946-5.7539,1.53273-8.58559l1.41958.28717c-.56874,2.81011-1.08049,5.67645-1.52078,8.51981Zm372.3323-7.25412c-.55241-2.82567-1.1755-5.67008-1.85313-8.454l1.40753-.34233c.68254,2.80512,1.31063,5.6715,1.86727,8.51839Zm-368.90123-9.70628-1.40506-.35224c.70342-2.80551,1.48251-5.63437,2.31571-8.40841l1.387.4166C221.68281,306.73031,220.90974,309.5376,220.21162,312.32154ZM585.019,305.21386c-.80774-2.75813-1.69046-5.53252-2.62339-8.24715l1.36934-.47106c.94071,2.73549,1.8305,5.53181,2.6446,8.3108Zm-359.82092-9.48811-1.3665-.48026c.96264-2.73832,2.002-5.48972,3.08915-8.17782l1.34316.5432c-1.079,2.66724-2.11061,5.39778-3.06582,8.11486ZM579.39385,288.849c-1.05671-2.66583-2.18839-5.3412-3.36393-7.9522l1.32124-.59484c1.18473,2.63116,2.32495,5.32706,3.38939,8.013Zm-347.69422-9.20024-1.31629-.60476c1.20984-2.6347,2.4975-5.27683,3.82722-7.85283l1.28729.66416C234.178,274.41191,232.90027,277.03388,231.69963,279.64877Zm340.60493-6.54433c-1.29644-2.55726-2.67007-5.11981-4.08255-7.61553l1.26041-.71367c1.4238,2.51517,2.80729,5.09718,4.11367,7.67423Zm-332.6545-8.85753-1.25546-.72282c1.445-2.50915,2.9689-5.02078,4.52957-7.46451l1.2208.77945C242.59632,259.26432,241.08377,261.75683,239.65006,264.24691Zm324.14424-6.18182c-1.5306-2.43666-3.13335-4.86412-4.76368-7.21519l1.18968-.82542c1.64307,2.36911,3.25854,4.815,4.80046,7.27036Zm-314.82059-8.41868-1.184-.83461c1.66994-2.36839,3.41591-4.729,5.19053-7.01644l1.14442.88766C252.36381,244.95346,250.63057,247.29605,248.97371,249.64641Zm304.96716-5.78856c-1.74562-2.28635-3.56339-4.55927-5.40449-6.75544l1.11046-.93046c1.85455,2.21315,3.68646,4.503,5.44552,6.80673ZM259.58678,235.964l-1.10268-.9393c1.874-2.20113,3.82721-4.392,5.80518-6.51178l1.05883.9881C263.38535,231.60489,261.447,233.7795,259.58678,235.964Zm283.24308-5.3656c-1.94579-2.118-3.96443-4.21729-5.99863-6.23876l1.02135-1.02771c2.04976,2.0374,4.08325,4.15222,6.04389,6.28615Zm-271.434-7.28912-1.01286-1.03549c2.07134-2.02642,4.21482-4.02988,6.37032-5.95443l.96474,1.08076c-2.13923,1.90974-4.26644,3.898-6.32221,5.90918Zm259.15943-4.91045c-2.13252-1.93412-4.33435-3.84171-6.544-5.66973l.92374-1.11612c2.22588,1.84184,4.44468,3.76391,6.59347,5.71288Zm-246.254-6.614-.91454-1.12321c2.24038-1.82445,4.5557-3.62385,6.88208-5.34827l.86291,1.16352c-2.309,1.7117-4.60705,3.49729-6.83046,5.308Zm13.89315-10.29724-.80845-1.20171c2.39776-1.61335,4.86624-3.19311,7.3372-4.69648l.75256,1.23779C303.024,198.31891,300.57424,199.887,298.1945,201.48762Zm14.76636-8.982-.6953-1.271c2.53674-1.38808,5.13784-2.73479,7.73081-4.00333l.63657,1.30143c-2.57312,1.25865-5.15442,2.59509-7.67206,3.97292Zm174.81894-3.35615c-2.57741-1.2841-5.21777-2.52472-7.84754-3.68717l.58565-1.32477c2.65026,1.17129,5.31113,2.42145,7.90834,3.71546ZM328.47624,184.9166l-.57574-1.329c2.651-1.149,5.36276-2.251,8.0597-3.27553l.51424,1.35448c-2.67644,1.01643-5.36737,2.10992-7.99818,3.25009Zm143.44443-2.77722c-2.68209-1.04007-5.42713-2.03243-8.15944-2.9491l.46116-1.37358c2.75282.92409,5.51908,1.92386,8.22168,2.97244Zm-127.2868-3.35828-.45121-1.37642c2.75282-.90252,5.56152-1.75235,8.34758-2.52506l.38725,1.39549C350.1526,177.04217,347.36548,177.8853,344.63387,178.7811Zm110.86043-2.15374c-2.76272-.78758-5.58061-1.52105-8.37516-2.1799l.33245-1.40966c2.81648.66381,5.65559,1.40293,8.44024,2.19618Zm-94.18613-2.47379-.32253-1.41213c2.82214-.6447,5.697-1.23212,8.54421-1.74562l.25746,1.42521C366.96128,172.931,364.10873,173.51382,361.30817,174.15357Zm77.34385-1.497c-2.82072-.52945-5.69378-1.00048-8.54-1.40011l.20087-1.4344c2.86813.40281,5.76381.87741,8.60645,1.41072Zm-60.31449-1.57623-.19168-1.43582c2.86743-.38265,5.78361-.70447,8.66729-.95557l.1259,1.4429C384.07729,170.38153,381.18372,170.70052,378.33753,171.08034Zm43.17868-.83108c-2.85326-.26877-5.75744-.476-8.63262-.615l.07073-1.44714c2.89638.1404,5.82251.34906,8.69769.62Zm-25.9396-.673-.06085-1.44715c2.66229-.111,5.3755-.16763,8.06537-.16833l.65567.00106-.00425,1.44855-.65142-.00106C400.91179,169.41005,398.21838,169.46628,395.57661,169.57627Z"
+    transform="translate(-206.78683 -123.98286)" fill="#e4e4e4"/>
+  <path
+    d="M618.18081,134.848l0,121.53565a10.87747,10.87747,0,0,1-10.86518,10.86518l-176.254,0a10.87747,10.87747,0,0,1-10.86518-10.86518l0-121.53565a10.87747,10.87747,0,0,1,10.86518-10.86518l176.254-.00005A10.87747,10.87747,0,0,1,618.18081,134.848Z"
+    transform="translate(-206.78683 -123.98286)" fill="#e4e4e4"/>
+  <path
+    d="M611.24859,134.63412l0,121.9635a3.35314,3.35314,0,0,1-3.34931,3.34931l-177.42131,0a3.35315,3.35315,0,0,1-3.34932-3.34931l0-121.96349a3.35315,3.35315,0,0,1,3.34931-3.34932l177.42132,0A3.35314,3.35314,0,0,1,611.24859,134.63412Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <rect x="239.88445" y="26.65652" width="145.03469" height="2.99359" fill="var(--color-green)"/>
+  <rect x="239.88446" y="36.13622" width="145.03469" height="2.99359" fill="var(--color-green)"/>
+  <rect x="239.88446" y="45.61595" width="145.03469" height="2.99359" fill="var(--color-green)"/>
+  <rect x="239.88445" y="60.65652" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <rect x="239.88446" y="70.13622" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <rect x="239.88446" y="79.61595" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <rect x="239.88445" y="94.65652" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <rect x="239.88446" y="104.13622" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <rect x="239.88446" y="113.61595" width="145.03469" height="2.99359" fill="#e4e4e4"/>
+  <path
+    d="M339.18767,567.6237H217.652a10.87748,10.87748,0,0,1-10.86519-10.86518V380.5045A10.87748,10.87748,0,0,1,217.652,369.63931H339.18767a10.87748,10.87748,0,0,1,10.86518,10.86519v176.254A10.87747,10.87747,0,0,1,339.18767,567.6237Z"
+    transform="translate(-206.78683 -123.98286)" fill="#e4e4e4"/>
+  <path
+    d="M339.40159,560.69148H217.43809a3.35315,3.35315,0,0,1-3.34931-3.34932V379.92085a3.35314,3.35314,0,0,1,3.34931-3.34931h121.9635a3.35314,3.35314,0,0,1,3.34931,3.34931V557.34216A3.35315,3.35315,0,0,1,339.40159,560.69148Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <rect x="31.35118" y="346.44201" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="31.35118" y="355.92172" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="31.35118" y="365.40145" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="31.35118" y="386.17222" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="31.35118" y="395.65193" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="31.35118" y="405.13166" width="80.56365" height="2.99359" fill="#e4e4e4"/>
+  <rect x="265.49334" y="406.87051" width="33.83702" height="32.66539"
+        transform="translate(-340.4299 6.37959) rotate(-21.14419)" fill="var(--color-green)"/>
+  <path
+    d="M264.87305,443.42761l-12.765-33.00522,34.15574-13.21007,12.7649,33.00522ZM253.40563,410.996l12.04124,31.13391,32.28419-12.486L285.68994,398.51Z"
+    transform="translate(-206.78683 -123.98286)" fill="#3f3d56"/>
+  <circle cx="196.79436" cy="234.46291" r="37.2593" fill="var(--color-green)"/>
+  <path
+    d="M383.80161,355.128a3.318,3.318,0,0,0,0,6.63591h12.41978a4.04654,4.04654,0,0,1,4.04206,4.04188v12.41987a3.31778,3.31778,0,0,0,6.63555,0V365.80574a4.04654,4.04654,0,0,1,4.04206-4.04188h12.41978a3.318,3.318,0,0,0,0-6.63591H410.94106a4.04654,4.04654,0,0,1-4.04206-4.04188V338.6662a3.31778,3.31778,0,0,0-6.63555,0v12.41987a4.04654,4.04654,0,0,1-4.04206,4.04188Z"
+    transform="translate(-206.78683 -123.98286)" fill="#fff"/>
+  <polygon points="635.135 638.023 622.147 638.022 615.968 587.925 635.137 587.926 635.135 638.023"
+           fill="#ffb6b6"/>
+  <path
+    d="M845.23424,774.59579l-41.87945-.00155v-.52971a16.30152,16.30152,0,0,1,16.30065-16.30039h.001l25.57855.001Z"
+    transform="translate(-206.78683 -123.98286)" fill="#2f2e41"/>
+  <polygon points="558.058 638.023 545.07 638.022 538.891 587.925 558.061 587.926 558.058 638.023"
+           fill="#ffb6b6"/>
+  <path
+    d="M768.15758,774.59579l-41.87945-.00155v-.52971a16.30152,16.30152,0,0,1,16.30065-16.30039h.001l25.57854.001Z"
+    transform="translate(-206.78683 -123.98286)" fill="#2f2e41"/>
+  <path
+    d="M758.89052,579.86376a11.8953,11.8953,0,0,0,3.19321-17.95836l13.3722-107.51459-25.84109,1.19536L744.596,560.89362a11.95979,11.95979,0,0,0,14.29451,18.97014Z"
+    transform="translate(-206.78683 -123.98286)" fill="#ffb6b6"/>
+  <path
+    d="M774.8895,473.0686l-26.656-3.88786a5.33371,5.33371,0,0,1-4.3383-6.81242l7.72875-25.72033a14.81269,14.81269,0,0,1,29.30245,4.36158l.06651,26.76956a5.33371,5.33371,0,0,1-6.1034,5.28947Z"
+    transform="translate(-206.78683 -123.98286)" fill="var(--color-green)"/>
+  <path
+    d="M759.35048,545.34361l-8.47093,7.83831.63262,41.1511s-7.16454,60.09366-7.81773,62.05324-3.28653,73.8107-3.28653,73.8107,13.717,6.53192,26.12768,2.61277c0,0,12.41065-58.78728,12.41065-75.77028L793.31646,597.599l16.35038,68.58516s7.16454,45.07025,9.7773,60.09367,2.61277,16.983,2.61277,16.983,20.90215,5.87873,26.12768,0c0,0-2.61276-77.07666-4.57234-84.915l-4.57234-93.40647Z"
+    transform="translate(-206.78683 -123.98286)" fill="#2f2e41"/>
+  <circle cx="590.77537" cy="254.47018" r="21.55534" fill="#ffb9b9"/>
+  <path
+    d="M821.85259,412.04366l32.21073,13.76581-13.717,75.77027s.67376,39.19153,2.61277,69.89155c1.60787,25.45724-96.67243,0-93.40647-21.55533s16.32981-47.683,16.32981-47.683,3.266-28.74045-3.91916-41.8043-2.61276-28.08725-2.61276-28.08725l28.752-19.0503S788.1115,413.39882,821.85259,412.04366Z"
+    transform="translate(-206.78683 -123.98286)" fill="var(--color-green)"/>
+  <path
+    d="M792.26647,364.34856a86.18834,86.18834,0,0,1,9.65858-.95759,14.54246,14.54246,0,0,1,6.90385.925c3.1936,1.52092,4.98294,4.959,6.15441,8.29665s2.00239,6.9045,4.17558,9.69549c3.61584-3.7743,4.33844-9.38553,4.87677-14.58457.37867-3.65681.71427-7.556-.97655-10.82051a17.10477,17.10477,0,0,0-4.50007-5.02612c-8.30838-6.91509-18.8606-12.35631-29.558-10.80315l-.25029,1.65157a29.49565,29.49565,0,0,0-5.45665.34292l.38221,4.09748-5.68218.36044-.218,4.27037-5.74645.19921a6.65809,6.65809,0,0,0,2.00451,4.32889,8.09425,8.09425,0,0,1-2.95152,1.33316c.95822,3.70948,1.88845,7.42745,2.87836,11.12859.72926,2.72642.599,5.13533,3.52339,3.80477,2.22661-1.0131,3.73313-4.23472,5.98422-5.56577A24.65479,24.65479,0,0,1,792.26647,364.34856Z"
+    transform="translate(-206.78683 -123.98286)" fill="#2f2e41"/>
+  <path
+    d="M869.91243,576.71082a11.89531,11.89531,0,0,0-.40347-18.23559L861.4606,450.4316l-25.10048,6.25755,15.804,104.2357a11.95979,11.95979,0,0,0,17.74831,15.786Z"
+    transform="translate(-206.78683 -123.98286)" fill="#ffb6b6"/>
+  <path
+    d="M864.58107,468.85559l-26.89985,1.43412a5.3337,5.3337,0,0,1-5.59415-5.82541l2.5158-26.73835a14.81269,14.81269,0,0,1,29.58775-1.49049l5.3335,26.23294a5.3337,5.3337,0,0,1-4.94305,6.38719Z"
+    transform="translate(-206.78683 -123.98286)" fill="var(--color-green)"/>
+  <path d="M992.21317,775.6237h-381a1,1,0,0,1,0-2h381a1,1,0,0,1,0,2Z"
+        transform="translate(-206.78683 -123.98286)" fill="#cacaca"/>
+</svg>
diff --git a/theseus_gui/src/assets/icons/index.js b/theseus_gui/src/assets/icons/index.js
index 195e41cfc..020e12313 100644
--- a/theseus_gui/src/assets/icons/index.js
+++ b/theseus_gui/src/assets/icons/index.js
@@ -2,5 +2,11 @@ export { default as ServerIcon } from './server.svg'
 export { default as MinimizeIcon } from './minimize.svg'
 export { default as MaximizeIcon } from './maximize.svg'
 export { default as SwapIcon } from './arrow-left-right.svg'
+export { default as ToggleIcon } from './toggle.svg'
 export { default as PackageIcon } from './package.svg'
 export { default as VersionIcon } from './milestone.svg'
+export { default as MoreIcon } from './more.svg'
+export { default as TextInputIcon } from './text-cursor-input.svg'
+export { default as AddProjectImage } from './add-project.svg'
+export { default as NewInstanceImage } from './new-instance.svg'
+export { default as MenuIcon } from './menu.svg'
diff --git a/theseus_gui/src/assets/icons/menu.svg b/theseus_gui/src/assets/icons/menu.svg
new file mode 100644
index 000000000..7bafeae4a
--- /dev/null
+++ b/theseus_gui/src/assets/icons/menu.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu"><line x1="4" x2="20" y1="12" y2="12"/><line x1="4" x2="20" y1="6" y2="6"/><line x1="4" x2="20" y1="18" y2="18"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/more.svg b/theseus_gui/src/assets/icons/more.svg
new file mode 100644
index 000000000..98f4a4dfe
--- /dev/null
+++ b/theseus_gui/src/assets/icons/more.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-more-vertical"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/new-instance.svg b/theseus_gui/src/assets/icons/new-instance.svg
new file mode 100644
index 000000000..b526f23ce
--- /dev/null
+++ b/theseus_gui/src/assets/icons/new-instance.svg
@@ -0,0 +1,138 @@
+<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" width="924.76626" height="641.9894"
+     viewBox="0 0 924.76626 641.9894" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path
+    d="M901.84039,677.83256c3.74046-30.07761,22.38093-59.7128,51.06588-69.50087a139.64665,139.64665,0,0,0,.00692,95.87682c4.40777,11.92286,10.55173,24.725,6.40563,36.74145-2.57964,7.477-8.89041,13.1975-15.94457,16.7744-7.0546,3.5769-14.88373,5.28172-22.61488,6.95243l-1.52153,1.25839C906.96476,738.22193,898.09992,707.91018,901.84039,677.83256Z"
+    transform="translate(-137.61687 -129.0053)" fill="#f0f0f0"/>
+  <path
+    d="M953.19092,608.90041a119.36031,119.36031,0,0,0-29.67278,67.17592,51.40093,51.40093,0,0,0,.58468,16.09418,29.48054,29.48054,0,0,0,7.33219,13.67368c3.30477,3.631,7.10567,6.96234,9.47027,11.33341a18.051,18.051,0,0,1,.88188,14.73616c-2.08769,5.98787-6.20242,10.86849-10.39214,15.50149-4.65189,5.14407-9.56524,10.41344-11.54265,17.23311-.23959.8263-1.50772.40622-1.26849-.41883,3.44035-11.865,14.95818-18.60464,20.451-29.29134,2.563-4.98661,3.63886-10.77584,1.236-16.03972-2.10117-4.603-6.01776-8.04173-9.39569-11.68923a31.458,31.458,0,0,1-7.66744-13.10281,47.51861,47.51861,0,0,1-1.20129-16.01232,115.8007,115.8007,0,0,1,8.45741-35.19088,121.4766,121.4766,0,0,1,21.84309-35.0047c.57116-.63958,1.45134.36648.88391,1.00188Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M923.87771,667.99227a17.90785,17.90785,0,0,1-13.6314-18.75913c.06806-.85679,1.40267-.79127,1.33452.06666a16.58227,16.58227,0,0,0,12.71571,17.424c.83627.19883.41265,1.46618-.41883,1.26849Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M929.51688,704.22384a34.51591,34.51591,0,0,0,15.41342-19.87863c.24251-.82542,1.51071-.4056,1.26849.41883A35.90175,35.90175,0,0,1,930.11768,705.417c-.74074.43939-1.33752-.75611-.6008-1.19312Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M936.9349,631.34025a10.13673,10.13673,0,0,0,9.60617-.48764c.73481-.44857,1.33082.74746.6008,1.19311a11.359,11.359,0,0,1-10.6258.563.69037.69037,0,0,1-.42483-.84366.6713.6713,0,0,1,.84366-.42482Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M1040.342,662.054c-.45086.29314-.90172.58628-1.35313.89071a133.49486,133.49486,0,0,0-17.06883,13.32611c-.41728.37207-.83456.75542-1.24028,1.13871a140.73351,140.73351,0,0,0-30.56436,41.83882,136.67119,136.67119,0,0,0-7.48626,19.36917c-2.76241,9.166-5.02827,19.324-10.4964,26.82144a23.44535,23.44535,0,0,1-1.82656,2.25485H920.89105c-.1123-.05636-.22516-.1015-.338-.15786l-1.973.09022c.07927-.3495.169-.71029.24827-1.05979.04514-.20293.1013-.40585.14644-.60878.03358-.13529.06771-.27064.09028-.39464.011-.04508.02257-.09015.03358-.124.02257-.124.0567-.23679.07927-.3495q.744-3.0271,1.53315-6.05427c0-.01129,0-.01129.011-.02257,4.04783-15.36682,9.41411-30.53071,16.91138-44.398.22571-.41714.45086-.84557.69914-1.26271a130.41346,130.41346,0,0,1,11.71411-17.76824,115.29059,115.29059,0,0,1,7.67783-8.78262,95.87273,95.87273,0,0,1,23.99138-17.97117c17.72338-9.35762,38.2422-12.94283,57.18328-7.22677C1039.38361,661.74961,1039.85759,661.89611,1040.342,662.054Z"
+    transform="translate(-137.61687 -129.0053)" fill="#f0f0f0"/>
+  <path
+    d="M1040.23094,662.68115a119.36024,119.36024,0,0,0-64.13659,35.77114,51.40084,51.40084,0,0,0-9.223,13.20232,29.48052,29.48052,0,0,0-2.37816,15.33216c.45258,4.88882,1.48168,9.83714.738,14.75085a18.051,18.051,0,0,1-8.168,12.297c-5.272,3.524-11.49586,4.94359-17.63051,6.12029-6.81135,1.30649-13.90692,2.55561-19.59168,6.8102-.68879.5155-1.4484-.58341-.76065-1.09813,9.89051-7.40226,23.14454-5.84891,33.96439-11.07458,5.04874-2.43839,9.39323-6.41306,10.64393-12.06264,1.09368-4.94031.03684-10.044-.4642-14.99a31.458,31.458,0,0,1,1.76676-15.07818,47.51855,47.51855,0,0,1,8.68137-13.5082,115.80059,115.80059,0,0,1,27.94011-23.006,121.4767,121.4767,0,0,1,38.51573-14.79824c.84111-.16679.93817,1.16642.10255,1.33212Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M981.2486,692.21411A17.90784,17.90784,0,0,1,981.659,669.029c.57019-.64313,1.59636.21271,1.02541.85669a16.58227,16.58227,0,0,0-.33766,21.56781c.548.66224-.55326,1.4191-1.09813.76065Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M963.93725,724.53816a34.51588,34.51588,0,0,0,24.27507-6.592c.69059-.513,1.45041.58571.76065,1.09813a35.90171,35.90171,0,0,1-25.27435,6.80826c-.856-.09514-.61271-1.409.23863-1.31436Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M1013.74109,670.81085a10.13669,10.13669,0,0,0,7.96358,5.39423c.85677.08425.61256,1.39806-.23863,1.31436a11.359,11.359,0,0,1-8.82308-5.94794.69036.69036,0,0,1,.16874-.92939.67131.67131,0,0,1,.92939.16874Z"
+    transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M742.23915,525.98269a10.0558,10.0558,0,0,0-1.61015-15.335l9.13555-34.54737-17.60072,5.92017-5.97689,31.89915a10.11027,10.11027,0,0,0,16.05221,12.06308Z"
+    transform="translate(-137.61687 -129.0053)" fill="#9e616a"/>
+  <polygon points="686.055 629.029 673.795 629.028 667.963 581.74 686.057 581.741 686.055 629.029"
+           fill="#9e616a"/>
+  <path
+    d="M826.79864,769.91783l-39.53076-.00146v-.5a15.38728,15.38728,0,0,1,15.38647-15.38623h.001l24.144.001Z"
+    transform="translate(-137.61687 -129.0053)" fill="#2f2e41"/>
+  <polygon points="628.055 629.029 615.795 629.028 609.963 581.74 628.057 581.741 628.055 629.029"
+           fill="#9e616a"/>
+  <path
+    d="M768.79864,769.91783l-39.53076-.00146v-.5a15.38728,15.38728,0,0,1,15.38647-15.38623h.001l24.144.001Z"
+    transform="translate(-137.61687 -129.0053)" fill="#2f2e41"/>
+  <path id="b1d8f474-012b-4d97-a964-9f33bafc8058-812" data-name="Path 1095"
+        d="M758.85336,473.11447l-4.706,1.3s-12.294,79.7-13.294,121.7,3,148,3,148h26l21-180,10,180h28s20-236,11-255S758.85336,473.11447,758.85336,473.11447Z"
+        transform="translate(-137.61687 -129.0053)" fill="#2f2e41"/>
+  <circle id="e76160c9-f3a1-43ce-a248-d388186e85bb" data-name="Ellipse 219" cx="658.74398"
+          cy="179.98357" r="23.49291" fill="#9e616a"/>
+  <path id="bb67ace3-6b73-4a38-bac1-9d795c287a43-813" data-name="Path 1099"
+        d="M855.85336,363.11447l-36.464-23.83-37.786,1.488-36.75,20.342,14,78-6,45s54-6,66,3a51.277,51.277,0,0,0,24,10l-2-77Z"
+        transform="translate(-137.61687 -129.0053)" fill="#3f3d56"/>
+  <path id="f7a1be30-9471-4724-82e7-c8ff3c288394-814" data-name="Path 1101"
+        d="M751.85336,360.11447l-3.778-.784-3.222,1.784s-9,12-9,23-11,117-11,117l20,9,16-83Z"
+        transform="translate(-137.61687 -129.0053)" fill="#3f3d56"/>
+  <path id="a2423779-f29b-465e-aa9d-0fc12224f03e-815" data-name="Path 1104"
+        d="M816.93427,291.7643s6.14449-11.74646-7.3736-12.81432c0,0-11.5243-10.454-23.27076-1.91114,0,0-6.40715,0-9.91084,7.25044,0,0-5.03919-1.91114-6.14657,3.20358,0,0-3.68733,10.67861,0,20.28934s4.91212,10.6786,4.91212,10.6786-6.059-20.14943,8.6892-21.21729,31.252-10.28455,32.48107,1.46189,3.07866,14.64066,3.07866,14.64066S831.06737,296.56968,816.93427,291.7643Z"
+        transform="translate(-137.61687 -129.0053)" fill="#2f2e41"/>
+  <path id="e9616824-6bd8-4015-8eb7-3dcfe132b2c0-816" data-name="Subtraction 1"
+        d="M513.35252,429.96937h-291v-218h291Z" transform="translate(-137.61687 -129.0053)"
+        fill="#fff"/>
+  <path id="f4711ed8-dad6-4be5-800d-5829f7fb3f37-817" data-name="Subtraction 1"
+        d="M513.35252,429.96937h-291v-218h291Zm-288-215v212h285v-212Z"
+        transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <g id="b3812a0d-69b2-4ac3-87c4-e066c2de2dfd" data-name="Group 41">
+    <circle id="fb0bff05-a63a-421c-8737-de050f830f30" data-name="Ellipse 220" cx="230.14466"
+            cy="192.37305" r="55.409" fill="var(--color-green)"/>
+    <path id="f9b355f0-5797-4243-8ae5-6fe77774d21b-818" data-name="Path 1106"
+          d="M390.77053,316.72537h-18.839v-18.839a4.433,4.433,0,0,0-4.433-4.433h0a4.433,4.433,0,0,0-4.433,4.433v18.839h-18.839a4.433,4.433,0,0,0-4.433,4.433v0h0a4.433,4.433,0,0,0,4.433,4.433h18.839v18.839a4.433,4.433,0,0,0,4.433,4.433h0a4.433,4.433,0,0,0,4.433-4.433V325.59137h18.839a4.433,4.433,0,0,0,4.433-4.433v0h0a4.433,4.433,0,0,0-4.433-4.433h0Z"
+          transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  </g>
+  <path d="M246.35588,211.0595h-108.739V129.0053h108.739Z"
+        transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path d="M246.35588,211.0595h-108.739V129.0053h108.739Zm-106.739-2h104.739V131.0053h-104.739Z"
+        transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <rect id="a0756b3d-8076-4d61-8f2c-cdb882ad5331" data-name="Rectangle 342" x="14.34201"
+        y="22.34808" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <rect id="b5dd6458-8ffa-4f7b-ade4-3f6bf4de284a" data-name="Rectangle 343" x="14.34201"
+        y="38.35803" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <rect id="bf0c907d-dbb4-4364-8cdd-63eed4118a99" data-name="Rectangle 344" x="14.34201"
+        y="54.36908" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <path d="M969.35588,770.0595h-108.739V688.0053h108.739Z"
+        transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path d="M969.35588,770.0595h-108.739V688.0053h108.739Zm-106.739-2h104.739V690.0053h-104.739Z"
+        transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <rect id="b0c2ce11-0b20-4ceb-9ae2-a734f04b6c4a" data-name="Rectangle 342" x="737.34201"
+        y="581.34808" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <rect id="bf5a9fda-652f-454e-a316-4f0fe63005cd" data-name="Rectangle 343" x="737.34201"
+        y="597.35803" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <rect id="ad5f030a-4549-4063-8a1c-b5f384f37057" data-name="Rectangle 344" x="737.34201"
+        y="613.36908" width="80.054" height="5.337" fill="#e4e4e4"/>
+  <path d="M903.31826,622.82706l-81.22118-72.3,54.55741-61.28931,81.22119,72.3Z"
+        transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M903.31826,622.82706l-81.22118-72.3,54.55741-61.28931,81.22119,72.3ZM824.92074,550.363l78.23344,69.64043L955.052,561.70184,876.81858,492.0614Z"
+    transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <rect id="b060c16b-2eb9-48d7-8f6b-fd5295a89bd0" data-name="Rectangle 342" x="897.96282"
+        y="504.04622" width="5.337" height="80.054"
+        transform="translate(-242.1991 726.03121) rotate(-48.32574)" fill="#e4e4e4"/>
+  <rect id="aedfd2a5-e201-47b6-a3ec-b56955ab97bd" data-name="Rectangle 343" x="887.31788"
+        y="516.00464" width="5.337" height="80.054"
+        transform="translate(-254.69846 722.08744) rotate(-48.32574)" fill="#e4e4e4"/>
+  <rect id="b4720297-2a1d-43a8-8ac0-2a4c1ee9f1d2" data-name="Rectangle 344" x="876.67222"
+        y="527.96389" width="5.337" height="80.054"
+        transform="translate(-267.19868 718.1434) rotate(-48.32574)" fill="#e4e4e4"/>
+  <path d="M307.92339,259.0595H186.61687V167.52189H307.92339Z"
+        transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M307.92339,259.0595H186.61687V167.52189H307.92339ZM188.848,256.82835H305.69224V169.753H188.848Z"
+    transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <rect id="e724a003-6a25-4c83-be10-32efc1fd30bf" data-name="Rectangle 342" x="64.99958"
+        y="63.44755" width="89.30624" height="5.95382" fill="var(--color-green)"/>
+  <rect id="f16e8690-23eb-4802-9b18-78b8e9972275" data-name="Rectangle 343" x="64.99958"
+        y="81.30785" width="89.30624" height="5.95382" fill="var(--color-green)"/>
+  <rect id="ea05cbc1-1ae7-4cbc-994d-a1c0c2d5941e" data-name="Rectangle 344" x="64.99958"
+        y="99.16937" width="89.30624" height="5.95382" fill="var(--color-green)"/>
+  <path d="M622.73338,498.69378H437.61687V359.0053H622.73338Z"
+        transform="translate(-137.61687 -129.0053)" fill="#fff"/>
+  <path
+    d="M622.73338,498.69378H437.61687V359.0053H622.73338ZM441.02166,495.289H619.3286V362.41009H441.02166Z"
+    transform="translate(-137.61687 -129.0053)" fill="#e6e6e6"/>
+  <rect id="ac8b6f6a-33b0-4e01-bc67-8452ca74a9e6" data-name="Rectangle 342" x="324.41573"
+        y="268.04521" width="136.28335" height="9.08567" fill="var(--color-green)"/>
+  <rect id="e4f43daa-ee47-4f01-aaaf-288902bf6f27" data-name="Rectangle 343" x="324.41573"
+        y="295.30043" width="136.28335" height="9.08567" fill="var(--color-green)"/>
+  <rect id="b40e1bee-dfb3-4798-af30-e469c9a00d65" data-name="Rectangle 344" x="324.41573"
+        y="322.55752" width="136.28335" height="9.08567" fill="var(--color-green)"/>
+  <path
+    d="M1061.19244,770.9947h-480.294a1.19069,1.19069,0,0,1,0-2.38137h480.294a1.19068,1.19068,0,1,1,0,2.38137Z"
+    transform="translate(-137.61687 -129.0053)" fill="#cacaca"/>
+  <path
+    d="M843.422,525.22926a10.05578,10.05578,0,0,1,5.50137-14.40454l.06041-35.73479,15.48506,10.24922-2.43139,32.363a10.11028,10.11028,0,0,1-18.61545,7.52706Z"
+    transform="translate(-137.61687 -129.0053)" fill="#9e616a"/>
+  <path id="b2a3d507-71c0-44dd-96fb-9359ee9fed80-819" data-name="Path 1100"
+        d="M844.85336,367.11447l6.918-6.668,5.082,3.668s5,6,9,24,0,117,0,117l-22-3,3-52-9-44Z"
+        transform="translate(-137.61687 -129.0053)" fill="#3f3d56"/>
+</svg>
diff --git a/theseus_gui/src/assets/icons/text-cursor-input.svg b/theseus_gui/src/assets/icons/text-cursor-input.svg
new file mode 100644
index 000000000..7bf2628df
--- /dev/null
+++ b/theseus_gui/src/assets/icons/text-cursor-input.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-text-cursor-input"><path d="M5 4h1a3 3 0 0 1 3 3 3 3 0 0 1 3-3h1"/><path d="M13 20h-1a3 3 0 0 1-3-3 3 3 0 0 1-3 3H5"/><path d="M5 16H4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h1"/><path d="M13 8h7a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-7"/><path d="M9 7v10"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/assets/icons/toggle.svg b/theseus_gui/src/assets/icons/toggle.svg
new file mode 100644
index 000000000..202f4537d
--- /dev/null
+++ b/theseus_gui/src/assets/icons/toggle.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-toggle-right"><rect width="20" height="12" x="2" y="6" rx="6" ry="6"/><circle cx="16" cy="12" r="2"/></svg>
\ No newline at end of file
diff --git a/theseus_gui/src/helpers/utils.js b/theseus_gui/src/helpers/utils.js
index ea8d61412..ae5b478c2 100644
--- a/theseus_gui/src/helpers/utils.js
+++ b/theseus_gui/src/helpers/utils.js
@@ -57,3 +57,13 @@ export const installVersionDependencies = async (profile, version) => {
     }
   }
 }
+
+export const openLink = (url) => {
+  window.__TAURI_INVOKE__('tauri', {
+    __tauriModule: 'Shell',
+    message: {
+      cmd: 'open',
+      path: url,
+    },
+  })
+}
diff --git a/theseus_gui/src/pages/Library.vue b/theseus_gui/src/pages/Library.vue
index 54af6a5f6..354f90f05 100644
--- a/theseus_gui/src/pages/Library.vue
+++ b/theseus_gui/src/pages/Library.vue
@@ -6,6 +6,9 @@ import { useRoute } from 'vue-router'
 import { useBreadcrumbs } from '@/store/breadcrumbs'
 import { profile_listener } from '@/helpers/events.js'
 import { handleError } from '@/store/notifications.js'
+import { Button, PlusIcon } from 'omorphia'
+import InstanceCreationModal from '@/components/ui/InstanceCreationModal.vue'
+import { NewInstanceImage } from '@/assets/icons'
 
 const route = useRoute()
 const breadcrumbs = useBreadcrumbs()
@@ -23,7 +26,23 @@ onUnmounted(() => unlisten())
 </script>
 
 <template>
-  <GridDisplay label="Instances" :instances="instances" class="display" />
+  <GridDisplay
+    v-if="instances.length > 0"
+    label="Instances"
+    :instances="instances"
+    class="display"
+  />
+  <div v-else class="no-instance">
+    <div class="icon">
+      <NewInstanceImage />
+    </div>
+    <h3>No instances found</h3>
+    <Button color="primary" @click="$refs.installationModal.show()">
+      <PlusIcon />
+      Create new instance
+    </Button>
+    <InstanceCreationModal ref="installationModal" />
+  </div>
 </template>
 
 <style lang="scss" scoped>
@@ -31,4 +50,25 @@ onUnmounted(() => unlisten())
   background-color: rgb(30, 31, 34);
   min-height: 100%;
 }
+
+.no-instance {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  gap: var(--gap-md);
+
+  p,
+  h3 {
+    margin: 0;
+  }
+
+  .icon {
+    svg {
+      width: 10rem;
+      height: 10rem;
+    }
+  }
+}
 </style>
diff --git a/theseus_gui/src/pages/instance/Index.vue b/theseus_gui/src/pages/instance/Index.vue
index 8db75a1e3..f479b1d48 100644
--- a/theseus_gui/src/pages/instance/Index.vue
+++ b/theseus_gui/src/pages/instance/Index.vue
@@ -101,6 +101,17 @@
     <template #open_folder> <ClipboardCopyIcon /> Open Folder </template>
     <template #copy_link> <ClipboardCopyIcon /> Copy Link </template>
     <template #open_link> <ClipboardCopyIcon /> Open In Modrinth <ExternalIcon /> </template>
+    <template #copy_names><EditIcon />Copy names</template>
+    <template #copy_slugs><HashIcon />Copy slugs</template>
+    <template #copy_links><GlobeIcon />Copy Links</template>
+    <template #toggle><EditIcon />Toggle selected</template>
+    <template #disable><XIcon />Disable selected</template>
+    <template #enable><CheckCircleIcon />Enable selected</template>
+    <template #hide_show><EyeIcon />Show/Hide unselected</template>
+    <template #update_all
+      ><UpdatedIcon />Update {{ selected.length > 0 ? 'selected' : 'all' }}</template
+    >
+    <template #filter_update><UpdatedIcon />Select Updatable</template>
   </ContextMenu>
   <ExportModal ref="exportModal" :instance="instance" />
 </template>
@@ -120,6 +131,12 @@ import {
   ClipboardCopyIcon,
   PlusIcon,
   ExternalIcon,
+  HashIcon,
+  GlobeIcon,
+  EyeIcon,
+  XIcon,
+  CheckCircleIcon,
+  UpdatedIcon,
 } from 'omorphia'
 import { get, run } from '@/helpers/profile'
 import {
@@ -340,6 +357,7 @@ Button {
   flex-direction: row;
   overflow: auto;
   gap: 1rem;
+  min-height: 100%;
 }
 
 .content {
diff --git a/theseus_gui/src/pages/instance/Logs.vue b/theseus_gui/src/pages/instance/Logs.vue
index c9eaa1636..185e05947 100644
--- a/theseus_gui/src/pages/instance/Logs.vue
+++ b/theseus_gui/src/pages/instance/Logs.vue
@@ -15,8 +15,8 @@
           <CheckIcon v-else />
           {{ copied ? 'Copied' : 'Copy' }}
         </Button>
-        <Button disabled color="primary">
-          <SendIcon />
+        <Button color="primary" @click="share">
+          <ShareIcon />
           Share
         </Button>
         <Button
@@ -38,6 +38,13 @@
         {{ line }} <br />
       </span>
     </div>
+    <ShareModal
+      ref="shareModal"
+      header="Share Log"
+      share-title="Instance Log"
+      share-text="Check out this log from an instance on the Modrinth App"
+      link
+    />
   </Card>
 </template>
 
@@ -48,8 +55,9 @@ import {
   CheckIcon,
   ClipboardCopyIcon,
   DropdownSelect,
-  SendIcon,
+  ShareIcon,
   TrashIcon,
+  ShareModal,
 } from 'omorphia'
 import { delete_logs_by_datetime, get_logs, get_output_by_datetime } from '@/helpers/logs.js'
 import { nextTick, onBeforeUnmount, onMounted, onUnmounted, ref, watch } from 'vue'
@@ -59,6 +67,7 @@ import { get_output_by_uuid, get_uuids_by_profile_path } from '@/helpers/process
 import { useRoute } from 'vue-router'
 import { process_listener } from '@/helpers/events.js'
 import { handleError } from '@/store/notifications.js'
+import { ofetch } from 'ofetch'
 
 dayjs.extend(calendar)
 
@@ -71,6 +80,17 @@ const props = defineProps({
   },
 })
 
+const logs = ref([])
+await setLogs()
+
+const selectedLogIndex = ref(0)
+const copied = ref(false)
+const logContainer = ref(null)
+const interval = ref(null)
+const userScrolled = ref(false)
+const isAutoScrolling = ref(false)
+const shareModal = ref(null)
+
 async function getLiveLog() {
   if (route.params.id) {
     const uuids = await get_uuids_by_profile_path(route.params.id).catch(handleError)
@@ -101,12 +121,6 @@ async function setLogs() {
   logs.value = [liveLog, ...allLogs]
 }
 
-const logs = ref([])
-await setLogs()
-
-const selectedLogIndex = ref(0)
-const copied = ref(false)
-
 const copyLog = () => {
   if (logs.value[selectedLogIndex.value]) {
     navigator.clipboard.writeText(logs.value[selectedLogIndex.value].stdout)
@@ -114,6 +128,20 @@ const copyLog = () => {
   }
 }
 
+const share = async () => {
+  if (logs.value[selectedLogIndex.value]) {
+    const url = await ofetch('https://api.mclo.gs/1/log', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded',
+      },
+      body: `content=${encodeURIComponent(logs.value[selectedLogIndex.value].stdout)}`,
+    }).catch(handleError)
+
+    shareModal.value.show(url.url)
+  }
+}
+
 watch(selectedLogIndex, async (newIndex) => {
   copied.value = false
   userScrolled.value = false
@@ -143,11 +171,6 @@ const deleteLog = async () => {
   }
 }
 
-const logContainer = ref(null)
-const interval = ref(null)
-const userScrolled = ref(false)
-const isAutoScrolling = ref(false)
-
 function handleUserScroll() {
   if (!isAutoScrolling.value) {
     userScrolled.value = true
diff --git a/theseus_gui/src/pages/instance/Mods.vue b/theseus_gui/src/pages/instance/Mods.vue
index a82bac80e..d408e787d 100644
--- a/theseus_gui/src/pages/instance/Mods.vue
+++ b/theseus_gui/src/pages/instance/Mods.vue
@@ -1,5 +1,12 @@
 <template>
-  <Card class="mod-card">
+  <Card v-if="projects.length > 0" class="mod-card">
+    <div class="second-row">
+      <Chips
+        v-if="Object.keys(selectableProjectTypes).length > 1"
+        v-model="selectedProjectType"
+        :items="Object.keys(selectableProjectTypes)"
+      />
+    </div>
     <div class="card-row">
       <div class="iconified-input">
         <SearchIcon />
@@ -18,16 +25,6 @@
         </Button>
       </div>
       <span class="manage">
-        <span class="text-combo">
-          <span class="no-wrap sort"> Sort by </span>
-          <DropdownSelect
-            v-model="sortFilter"
-            name="sort-by"
-            :options="['Name', 'Version', 'Author', 'Enabled']"
-            default-value="Name"
-            class="dropdown"
-          />
-        </span>
         <DropdownButton
           :options="['search', 'from_file']"
           default-value="search"
@@ -46,138 +43,224 @@
         </DropdownButton>
       </span>
     </div>
-    <div class="second-row">
-      <Chips
-        v-if="Object.keys(selectableProjectTypes).length > 1"
-        v-model="selectedProjectType"
-        :items="Object.keys(selectableProjectTypes)"
-      />
-      <DropdownButton
-        :options="['update_all', 'filter_update']"
-        default-value="update_all"
-        :disabled="!projects.some((x) => x.outdated)"
-        name="update-all-dropdown"
-        @option-click="updateAll"
-      >
-        <template #update_all>
-          <UpdatedIcon />
-          Update {{ selected.length > 0 ? 'selected' : 'all' }}
-        </template>
-        <template #filter_update>
-          <UpdatedIcon />
-          Select updatable
-        </template>
-      </DropdownButton>
-      <Button v-if="selected.length > 0" class="no-wrap" @click="deleteWarning.show()">
-        <TrashIcon />
-        Remove selected
-      </Button>
-      <DropdownButton
-        v-if="selected.length > 0"
-        :options="['toggle', 'disable', 'enable', 'hide_show']"
-        default-value="toggle"
-        @option-click="toggleSelected"
-      >
-        <template #toggle>
-          <EditIcon />
-          Toggle selected
-        </template>
-        <template #disable>
-          <XIcon />
-          Disable selected
-        </template>
-        <template #enable>
-          <CheckCircleIcon />
-          Enable selected
-        </template>
-        <template #hide_show>
-          <CheckCircleIcon />
-          {{ hideNonSelected ? 'Show' : 'Hide' }} unselected
-        </template>
-      </DropdownButton>
-      <DropdownButton
-        v-if="selected.length > 0"
-        :options="['copy_name', 'copy_url', 'copy_slug']"
-        default-value="copy_name"
-        @option-click="copySelected"
-      >
-        <template #copy_name>
-          <EditIcon />
-          Copy names
-        </template>
-        <template #copy_slug>
-          <HashIcon />
-          Copy slugs
-        </template>
-        <template #copy_url>
-          <GlobeIcon />
-          Copy URLs
-        </template>
-      </DropdownButton>
-    </div>
-    <div class="table">
-      <div class="table-row table-head">
-        <div class="table-cell table-text">
-          <Checkbox v-model="selectAll" class="select-checkbox" />
+    <div>
+      <div class="table">
+        <div class="table-row table-head" :class="{ 'show-options': selected.length > 0 }">
+          <div class="table-cell table-text">
+            <Checkbox v-model="selectAll" class="select-checkbox" />
+          </div>
+          <div v-if="selected.length === 0" class="table-cell table-text name-cell actions-cell">
+            <Button class="transparent" @click="sortProjects('Name')">
+              Name
+              <DropdownIcon v-if="sortColumn === 'Name'" :class="{ down: ascending }" />
+            </Button>
+          </div>
+          <div v-if="selected.length === 0" class="table-cell table-text">
+            <Button class="transparent" @click="sortProjects('Version')">
+              Version
+              <DropdownIcon v-if="sortColumn === 'Version'" :class="{ down: ascending }" />
+            </Button>
+          </div>
+          <div v-if="selected.length === 0" class="table-cell table-text">
+            <Button class="transparent" @click="sortProjects('Author')">
+              Author
+              <DropdownIcon v-if="sortColumn === 'Author'" :class="{ down: ascending }" />
+            </Button>
+          </div>
+          <div v-if="selected.length === 0" class="table-cell table-text actions-cell">
+            <Button class="transparent" @click="sortProjects('Enabled')">
+              Actions
+              <DropdownIcon v-if="sortColumn === 'Enabled'" :class="{ down: ascending }" />
+            </Button>
+          </div>
+          <div v-else class="options table-cell name-cell">
+            <Button
+              class="transparent share"
+              @click="() => (showingOptions = !showingOptions)"
+              @mouseover="selectedOption = 'Share'"
+            >
+              <MenuIcon :class="{ open: showingOptions }" />
+            </Button>
+            <Button
+              class="transparent share"
+              @click="shareNames()"
+              @mouseover="selectedOption = 'Share'"
+            >
+              <ShareIcon />
+              Share
+            </Button>
+            <Button
+              class="transparent trash"
+              @click="deleteWarning.show()"
+              @mouseover="selectedOption = 'Delete'"
+            >
+              <TrashIcon />
+              Delete
+            </Button>
+            <Button
+              class="transparent update"
+              @click="updateAll()"
+              @mouseover="selectedOption = 'Update'"
+            >
+              <UpdatedIcon />
+              Update
+            </Button>
+            <Button
+              class="transparent"
+              @click="toggleSelected()"
+              @mouseover="selectedOption = 'Toggle'"
+            >
+              <ToggleIcon />
+              Toggle
+            </Button>
+          </div>
         </div>
-        <div class="table-cell table-text name-cell">Name</div>
-        <div class="table-cell table-text">Version</div>
-        <div class="table-cell table-text">Author</div>
-        <div class="table-cell table-text">Actions</div>
-      </div>
-      <div
-        v-for="mod in search"
-        :key="mod.file_name"
-        class="table-row"
-        @contextmenu.prevent.stop="(c) => handleRightClick(c, mod)"
-      >
-        <div class="table-cell table-text">
-          <Checkbox v-model="mod.selected" class="select-checkbox" />
+        <div v-if="showingOptions && selected.length > 0" class="more-box">
+          <section v-if="selectedOption === 'Share'" class="options">
+            <Button class="transparent" @click="shareNames()">
+              <TextInputIcon />
+              Share names
+            </Button>
+            <Button class="transparent" @click="shareUrls()">
+              <GlobeIcon />
+              Share URLs
+            </Button>
+            <Button class="transparent" @click="shareFileNames()">
+              <FileIcon />
+              Share file names
+            </Button>
+            <Button class="transparent" @click="shareMarkdown()">
+              <CodeIcon />
+              Share as markdown
+            </Button>
+          </section>
+          <section v-if="selectedOption === 'Delete'" class="options">
+            <Button class="transparent" @click="deleteWarning.show()">
+              <TrashIcon />
+              Delete selected
+            </Button>
+            <Button class="transparent" @click="deleteDisabledWarning.show()">
+              <ToggleIcon />
+              Delete disabled
+            </Button>
+          </section>
+          <section v-if="selectedOption === 'Update'" class="options">
+            <Button class="transparent" @click="updateAll()">
+              <UpdatedIcon />
+              Update all
+            </Button>
+            <Button class="transparent" @click="selectUpdatable()">
+              <CheckIcon />
+              Select updatable
+            </Button>
+          </section>
+          <section v-if="selectedOption === 'Toggle'" class="options">
+            <Button class="transparent" @click="enableAll()">
+              <CheckIcon />
+              Toggle on
+            </Button>
+            <Button class="transparent" @click="disableAll()">
+              <XIcon />
+              Toggle off
+            </Button>
+            <Button class="transparent" @click="hideShowAll()">
+              <EyeIcon v-if="hideNonSelected" />
+              <EyeOffIcon v-else />
+              {{ hideNonSelected ? 'Show' : 'Hide' }} untoggled
+            </Button>
+          </section>
         </div>
-        <div class="table-cell table-text name-cell">
-          <router-link
-            v-if="mod.slug"
-            :to="{ path: `/project/${mod.slug}/`, query: { i: props.instance.path } }"
-            class="mod-text"
-          >
-            <Avatar :src="mod.icon" />
-            {{ mod.name }}
-          </router-link>
-          <div v-else class="mod-text">
-            <Avatar :src="mod.icon" />
-            {{ mod.name }}
+        <div
+          v-for="mod in search"
+          :key="mod.file_name"
+          class="table-row"
+          @contextmenu.prevent.stop="(c) => handleRightClick(c, mod)"
+        >
+          <div class="table-cell table-text">
+            <Checkbox
+              :model-value="selectionMap.get(mod.path)"
+              class="select-checkbox"
+              @update:model-value="(newValue) => selectionMap.set(mod.path, newValue)"
+            />
+          </div>
+          <div class="table-cell table-text name-cell">
+            <router-link
+              v-if="mod.slug"
+              :to="{ path: `/project/${mod.slug}/`, query: { i: props.instance.path } }"
+              class="mod-text"
+            >
+              <Avatar :src="mod.icon" />
+              {{ mod.name }}
+            </router-link>
+            <div v-else class="mod-text">
+              <Avatar :src="mod.icon" />
+              {{ mod.name }}
+            </div>
+          </div>
+          <div class="table-cell table-text">{{ mod.version }}</div>
+          <div class="table-cell table-text">{{ mod.author }}</div>
+          <div class="table-cell table-text manage">
+            <Button v-tooltip="'Remove project'" icon-only @click="removeMod(mod)">
+              <TrashIcon />
+            </Button>
+            <AnimatedLogo
+              v-if="mod.updating"
+              class="btn icon-only updating-indicator"
+            ></AnimatedLogo>
+            <Button
+              v-else
+              v-tooltip="'Update project'"
+              :disabled="!mod.outdated"
+              icon-only
+              @click="updateProject(mod)"
+            >
+              <UpdatedIcon v-if="mod.outdated" />
+              <CheckIcon v-else />
+            </Button>
+            <input
+              id="switch-1"
+              autocomplete="off"
+              type="checkbox"
+              class="switch stylized-toggle"
+              :checked="!mod.disabled"
+              @change="toggleDisableMod(mod)"
+            />
           </div>
-        </div>
-        <div class="table-cell table-text">{{ mod.version }}</div>
-        <div class="table-cell table-text">{{ mod.author }}</div>
-        <div class="table-cell table-text manage">
-          <Button v-tooltip="'Remove project'" icon-only @click="removeMod(mod)">
-            <TrashIcon />
-          </Button>
-          <AnimatedLogo v-if="mod.updating" class="btn icon-only updating-indicator"></AnimatedLogo>
-          <Button v-else :disabled="!mod.outdated" icon-only @click="updateProject(mod)">
-            <UpdatedIcon v-if="mod.outdated" v-tooltip="'Update project'" />
-            <CheckIcon v-else v-tooltip="'Updated'" />
-          </Button>
-          <input
-            id="switch-1"
-            autocomplete="off"
-            type="checkbox"
-            class="switch stylized-toggle"
-            :disabled="mod.toggleInProgress"
-            :checked="!mod.disabled"
-            @change="toggleDisableMod(mod)"
-          />
         </div>
       </div>
     </div>
   </Card>
+  <div v-else class="empty-prompt">
+    <div class="empty-icon">
+      <AddProjectImage />
+    </div>
+    <h3>No projects found</h3>
+    <p class="empty-subtitle">Add a project to get started</p>
+    <div class="empty-action">
+      <DropdownButton
+        :options="['search', 'from_file']"
+        default-value="search"
+        name="add-content-dropdown-from-empty"
+        color="primary"
+        @option-click="handleContentOptionClick"
+      >
+        <template #search>
+          <SearchIcon />
+          <span class="no-wrap"> Add content </span>
+        </template>
+        <template #from_file>
+          <FolderOpenIcon />
+          <span class="no-wrap"> Add from file </span>
+        </template>
+      </DropdownButton>
+    </div>
+  </div>
   <Modal ref="deleteWarning" header="Are you sure?">
     <div class="modal-body">
       <div class="markdown-body">
         <p>
-          Are you sure you want to remove <strong>{{ selected.length }} projects</strong> from
-          {{ instance.metadata.name }}?
+          Are you sure you want to remove
+          <strong>{{ functionValues.length }} project(s)</strong> from {{ instance.metadata.name }}?
           <br />
           This action <strong>cannot</strong> be undone.
         </p>
@@ -191,6 +274,34 @@
       </div>
     </div>
   </Modal>
+  <Modal ref="deleteDisabledWarning" header="Are you sure?">
+    <div class="modal-body">
+      <div class="markdown-body">
+        <p>
+          Are you sure you want to remove
+          <strong
+            >{{ Array.from(projects.values()).filter((x) => x.disabled).length }} disabled
+            project(s)</strong
+          >
+          from {{ instance.metadata.name }}?
+          <br />
+          This action <strong>cannot</strong> be undone.
+        </p>
+      </div>
+      <div class="button-group push-right">
+        <Button @click="deleteDisabledWarning.hide()"> Cancel </Button>
+        <Button color="danger" @click="deleteDisabled">
+          <TrashIcon />
+          Remove
+        </Button>
+      </div>
+    </div>
+  </Modal>
+  <ShareModal
+    ref="shareModal"
+    share-title="Sharing modpack content"
+    share-text="Check out the projects I'm using in my modpack!"
+  />
 </template>
 <script setup>
 import {
@@ -201,19 +312,22 @@ import {
   CheckIcon,
   SearchIcon,
   UpdatedIcon,
-  DropdownSelect,
   AnimatedLogo,
   Chips,
   FolderOpenIcon,
   Checkbox,
   formatProjectType,
   DropdownButton,
-  EditIcon,
-  GlobeIcon,
-  HashIcon,
   Modal,
   XIcon,
-  CheckCircleIcon,
+  ShareIcon,
+  DropdownIcon,
+  GlobeIcon,
+  FileIcon,
+  EyeIcon,
+  EyeOffIcon,
+  ShareModal,
+  CodeIcon,
 } from 'omorphia'
 import { computed, ref, watch } from 'vue'
 import { convertFileSrc } from '@tauri-apps/api/tauri'
@@ -230,6 +344,7 @@ import { handleError } from '@/store/notifications.js'
 import mixpanel from 'mixpanel-browser'
 import { open } from '@tauri-apps/api/dialog'
 import { listen } from '@tauri-apps/api/event'
+import { MenuIcon, ToggleIcon, TextInputIcon, AddProjectImage } from '@/assets/icons'
 
 const router = useRouter()
 
@@ -249,6 +364,8 @@ const props = defineProps({
 })
 
 const projects = ref([])
+const selectionMap = ref(new Map())
+const showingOptions = ref(false)
 
 const initProjects = (initInstance) => {
   projects.value = []
@@ -295,22 +412,53 @@ const initProjects = (initInstance) => {
       })
     }
   }
+
+  const newSelectionMap = new Map()
+  for (const project of projects.value) {
+    newSelectionMap.set(
+      project.path,
+      selectionMap.value.get(project.path) ??
+        selectionMap.value.get(project.path.slice(0, -9)) ??
+        selectionMap.value.get(project.path + '.disabled') ??
+        false
+    )
+  }
+  selectionMap.value = newSelectionMap
 }
 
 initProjects(props.instance)
 
 watch(
   () => props.instance.projects,
-  () => initProjects(props.instance)
+  () => {
+    initProjects(props.instance)
+  }
 )
 
 const searchFilter = ref('')
 const selectAll = ref(false)
-const sortFilter = ref('')
 const selectedProjectType = ref('All')
-const selected = computed(() => projects.value.filter((mod) => mod.selected))
 const deleteWarning = ref(null)
+const deleteDisabledWarning = ref(null)
 const hideNonSelected = ref(false)
+const selectedOption = ref('Share')
+const shareModal = ref(null)
+const ascending = ref(true)
+const sortColumn = ref('Name')
+
+const selected = computed(() =>
+  Array.from(selectionMap.value)
+    .filter((args) => {
+      return args[1]
+    })
+    .map((args) => {
+      return projects.value.find((x) => x.path === args[0])
+    })
+)
+
+const functionValues = computed(() =>
+  selected.value.length > 0 ? selected.value : Array.from(projects.value.values())
+)
 
 const selectableProjectTypes = computed(() => {
   const obj = { All: 'all' }
@@ -334,101 +482,110 @@ const search = computed(() => {
     })
     .filter((mod) => {
       if (hideNonSelected.value) {
-        return mod.selected
+        return !mod.disabled
       }
       return true
     })
 
-  return updateSort(filtered, sortFilter.value)
+  return updateSort(filtered)
 })
 
-function updateSort(projects, sort) {
-  switch (sort) {
+const updateSort = (projects) => {
+  switch (sortColumn.value) {
     case 'Version':
       return projects.slice().sort((a, b) => {
         if (a.version < b.version) {
-          return -1
+          return ascending.value ? -1 : 1
         }
         if (a.version > b.version) {
-          return 1
+          return ascending.value ? 1 : -1
         }
         return 0
       })
     case 'Author':
       return projects.slice().sort((a, b) => {
         if (a.author < b.author) {
-          return -1
+          return ascending.value ? -1 : 1
         }
         if (a.author > b.author) {
-          return 1
+          return ascending.value ? 1 : -1
         }
         return 0
       })
     case 'Enabled':
       return projects.slice().sort((a, b) => {
         if (a.disabled && !b.disabled) {
-          return 1
+          return ascending.value ? 1 : -1
         }
         if (!a.disabled && b.disabled) {
-          return -1
+          return ascending.value ? -1 : 1
         }
         return 0
       })
     default:
       return projects.slice().sort((a, b) => {
         if (a.name < b.name) {
-          return -1
+          return ascending.value ? -1 : 1
         }
         if (a.name > b.name) {
-          return 1
+          return ascending.value ? 1 : -1
         }
         return 0
       })
   }
 }
 
-async function updateAll(args) {
-  if (args.option === 'update_all') {
-    const setProjects = []
-    for (const [i, project] of selected.value ?? projects.value.entries()) {
-      if (project.outdated) {
-        project.updating = true
-        setProjects.push(i)
-      }
+const sortProjects = (filter) => {
+  if (sortColumn.value === filter) {
+    ascending.value = !ascending.value
+  } else {
+    sortColumn.value = filter
+    ascending.value = true
+  }
+}
+
+const updateAll = async () => {
+  const setProjects = []
+  for (const [i, project] of projects.value.entries()) {
+    if (project.outdated) {
+      project.updating = true
+      setProjects.push(i)
     }
+  }
 
-    const paths = await update_all(props.instance.path).catch(handleError)
+  const paths = await update_all(props.instance.path).catch(handleError)
 
-    for (const [oldVal, newVal] of Object.entries(paths)) {
-      const index = projects.value.findIndex((x) => x.path === oldVal)
-      projects.value[index].path = newVal
-      projects.value[index].outdated = false
+  for (const [oldVal, newVal] of Object.entries(paths)) {
+    const index = projects.value.findIndex((x) => x.path === oldVal)
+    projects.value[index].path = newVal
+    projects.value[index].outdated = false
 
-      if (projects.value[index].updateVersion) {
-        projects.value[index].version = projects.value[index].updateVersion.version_number
-        projects.value[index].updateVersion = null
-      }
-    }
-    for (const project of setProjects) {
-      projects.value[project].updating = false
+    if (projects.value[index].updateVersion) {
+      projects.value[index].version = projects.value[index].updateVersion.version_number
+      projects.value[index].updateVersion = null
     }
+  }
+  for (const project of setProjects) {
+    projects.value[project].updating = false
+  }
 
-    mixpanel.track('InstanceUpdateAll', {
-      loader: props.instance.metadata.loader,
-      game_version: props.instance.metadata.game_version,
-      count: setProjects.length,
-      selected: selected.value.length > 1,
-    })
-  } else {
-    for (const project of projects.value) {
-      if (project.outdated) {
-        project.selected = true
-      }
+  mixpanel.track('InstanceUpdateAll', {
+    loader: props.instance.metadata.loader,
+    game_version: props.instance.metadata.game_version,
+    count: setProjects.length,
+    selected: selected.value.length > 1,
+  })
+}
+
+const selectUpdatable = () => {
+  for (const project of projects.value) {
+    if (project.outdated) {
+      selectionMap.value.set(project.path, true)
     }
   }
 }
 
-async function updateProject(mod) {
+const updateProject = async (mod) => {
   mod.updating = true
   mod.path = await update_project(props.instance.path, mod.path).catch(handleError)
   mod.updating = false
@@ -446,7 +603,7 @@ async function updateProject(mod) {
   })
 }
 
-async function toggleDisableMod(mod) {
+const toggleDisableMod = async (mod) => {
   mod.path = await toggle_disable_project(props.instance.path, mod.path).catch(handleError)
   mod.disabled = !mod.disabled
   mixpanel.track('InstanceProjectDisable', {
@@ -459,7 +616,7 @@ async function toggleDisableMod(mod) {
   })
 }
 
-async function removeMod(mod) {
+const removeMod = async (mod) => {
   await remove_project(props.instance.path, mod.path).catch(handleError)
   projects.value = projects.value.filter((x) => mod.path !== x.path)
 
@@ -472,94 +629,79 @@ async function removeMod(mod) {
   })
 }
 
-const handleContentOptionClick = async (args) => {
-  if (args.option === 'search') {
-    await router.push({
-      path: `/browse/${props.instance.metadata.loader === 'vanilla' ? 'datapack' : 'mod'}`,
-      query: { i: props.instance.path },
-    })
-  } else if (args.option === 'from_file') {
-    const newProject = await open({ multiple: true })
-    if (!newProject) return
-
-    for (const project of newProject) {
-      await add_project_from_path(props.instance.path, project, 'mod').catch(handleError)
-      initProjects(await get(props.instance.path).catch(handleError))
-    }
+const deleteSelected = async () => {
+  for (const project of functionValues.value) {
+    await remove_project(props.instance.path, project.path).catch(handleError)
   }
-}
 
-listen('tauri://file-drop', async (event) => {
-  for (const file of event.payload) {
-    await add_project_from_path(props.instance.path, file, 'mod').catch(handleError)
-    initProjects(await get(props.instance.path).catch(handleError))
-  }
-})
+  projects.value = projects.value.filter((x) => !x.selected)
+  deleteWarning.value.hide()
+}
 
-async function deleteSelected() {
-  for (const project of selected.value) {
+const deleteDisabled = async () => {
+  for (const project of Array.of(projects.value.values().filter((x) => x.disabled))) {
     await remove_project(props.instance.path, project.path).catch(handleError)
   }
+
   projects.value = projects.value.filter((x) => !x.selected)
-  deleteWarning.value.hide()
+  deleteDisabledWarning.value.hide()
 }
 
-async function copySelected(args) {
-  switch (args.option) {
-    case 'copy_name':
-      await navigator.clipboard.writeText(selected.value.map((x) => x.name).join('\n'))
-      break
-    case 'copy_slug':
-      await navigator.clipboard.writeText(
-        selected.value
-          .filter((x) => x.slug)
-          .map((x) => x.slug)
-          .join('\n')
-      )
-      break
-    case 'copy_url':
-      await navigator.clipboard.writeText(
-        selected.value
-          .filter((x) => x.slug)
-          .map((x) => `https://modrinth.com/${x.project_type}/${x.slug}`)
-          .join('\n')
-      )
-      break
-  }
+const shareNames = async () => {
+  await shareModal.value.show(functionValues.value.map((x) => x.name).join('\n'))
 }
 
-async function toggleSelected(args) {
-  switch (args.option) {
-    case 'toggle':
-      for (const project of selected.value) {
-        await toggleDisableMod(project)
-      }
-      break
-    case 'enable':
-      for (const project of selected.value) {
-        if (project.disabled) {
-          await toggleDisableMod(project)
-        }
-      }
-      break
-    case 'disable':
-      for (const project of selected.value) {
-        if (!project.disabled) {
-          await toggleDisableMod(project)
+const shareFileNames = async () => {
+  await shareModal.value.show(functionValues.value.map((x) => x.file_name).join('\n'))
+}
+
+const shareUrls = async () => {
+  await shareModal.value.show(
+    functionValues.value
+      .filter((x) => x.slug)
+      .map((x) => `https://modrinth.com/${x.project_type}/${x.slug}`)
+      .join('\n')
+  )
+}
+
+const shareMarkdown = async () => {
+  await shareModal.value.show(
+    functionValues.value
+      .map((x) => {
+        if (x.slug) {
+          return `[${x.name}](https://modrinth.com/${x.project_type}/${x.slug})`
         }
-      }
-      break
-    case 'hide_show':
-      hideNonSelected.value = !hideNonSelected.value
-      break
+        return x.name
+      })
+      .join('\n')
+  )
+}
+
+const toggleSelected = async () => {
+  for (const project of functionValues.value) {
+    await toggleDisableMod(project, !project.disabled)
   }
 }
 
-watch(selectAll, () => {
-  for (const project of projects.value) {
-    project.selected = selectAll.value
+const enableAll = async () => {
+  for (const project of functionValues.value) {
+    if (project.disabled) {
+      await toggleDisableMod(project, false)
+    }
   }
-})
+}
+
+const disableAll = async () => {
+  for (const project of functionValues.value) {
+    if (!project.disabled) {
+      await toggleDisableMod(project, false)
+    }
+  }
+}
+
+const hideShowAll = async () => {
+  hideNonSelected.value = !hideNonSelected.value
+}
 
 const handleRightClick = (event, mod) => {
   if (mod.slug && mod.project_type) {
@@ -572,6 +714,38 @@ const handleRightClick = (event, mod) => {
     )
   }
 }
+
+const handleContentOptionClick = async (args) => {
+  if (args.option === 'search') {
+    await router.push({
+      path: `/browse/${props.instance.metadata.loader === 'vanilla' ? 'datapack' : 'mod'}`,
+      query: { i: props.instance.path },
+    })
+  } else if (args.option === 'from_file') {
+    const newProject = await open({ multiple: true })
+    if (!newProject) return
+
+    for (const project of newProject) {
+      await add_project_from_path(props.instance.path, project, 'mod').catch(handleError)
+    }
+    initProjects(await get(props.instance.path).catch(handleError))
+  }
+}
+
+watch(selectAll, () => {
+  for (const [key, value] of Array.from(selectionMap.value)) {
+    if (value !== selectAll.value) {
+      selectionMap.value.set(key, selectAll.value)
+    }
+  }
+})
+
+listen('tauri://file-drop', async (event) => {
+  for (const file of event.payload) {
+    await add_project_from_path(props.instance.path, file, 'mod').catch(handleError)
+  }
+  initProjects(await get(props.instance.path).catch(handleError))
+})
 </script>
 
 <style scoped lang="scss">
@@ -586,10 +760,23 @@ const handleRightClick = (event, mod) => {
 
 .table {
   margin-block-start: 0;
+  border-radius: var(--radius-lg);
+  border: 2px solid var(--color-bg);
 }
 
 .table-row {
   grid-template-columns: min-content 2fr 1fr 1fr 11rem;
+
+  &.show-options {
+    grid-template-columns: min-content auto;
+
+    .options {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      gap: var(--gap-md);
+    }
+  }
 }
 
 .table-cell {
@@ -599,6 +786,7 @@ const handleRightClick = (event, mod) => {
 .card-row {
   display: flex;
   align-items: center;
+  gap: var(--gap-md);
   justify-content: space-between;
   background-color: var(--color-raised-bg);
 }
@@ -606,7 +794,8 @@ const handleRightClick = (event, mod) => {
 .mod-card {
   display: flex;
   flex-direction: column;
-  gap: 1rem;
+  gap: var(--gap-sm);
+  justify-content: center;
   overflow: hidden;
 }
 
@@ -655,6 +844,91 @@ const handleRightClick = (event, mod) => {
     color: var(--color-contrast);
   }
 }
+
+.actions-cell {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+
+  .btn {
+    height: unset;
+    width: unset;
+    padding: 0;
+
+    &.trash {
+      color: var(--color-red);
+    }
+
+    &.update {
+      color: var(--color-green);
+    }
+
+    &.share {
+      color: var(--color-blue);
+    }
+  }
+}
+
+.more-box {
+  display: flex;
+  background-color: var(--color-bg);
+  padding: var(--gap-lg);
+
+  .options {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: row;
+    gap: var(--gap-md);
+    flex-grow: 1;
+  }
+}
+
+.btn {
+  &.transparent {
+    height: unset;
+    width: unset;
+    padding: 0;
+    color: var(--color-base);
+    gap: var(--gap-xs);
+    white-space: nowrap;
+
+    svg {
+      margin-right: 0 !important;
+      transition: transform 0.2s ease-in-out;
+
+      &.open {
+        transform: rotate(90deg);
+      }
+
+      &.down {
+        transform: rotate(180deg);
+      }
+    }
+  }
+}
+.empty-prompt {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--gap-md);
+  height: 100%;
+  width: 100%;
+  margin: auto;
+
+  .empty-icon {
+    svg {
+      width: 10rem;
+      height: 10rem;
+      color: var(--color-contrast);
+    }
+  }
+
+  p,
+  h3 {
+    margin: 0;
+  }
+}
 </style>
 <style lang="scss">
 .updating-indicator {