Skip to content

Commit ec1bca5

Browse files
zleyyijzleyyij
committed
progress towards svelte 5
1 parent 2d77af7 commit ec1bca5

33 files changed

+5936
-5266
lines changed

‎new/apps/web/package.json‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -16,34 +16,34 @@
1616
},
1717
"devDependencies": {
1818
"@playwright/test": "^1.28.1",
19+
"@skeletonlabs/skeleton": "2.10.4",
20+
"@skeletonlabs/tw-plugin": "0.4.0",
1921
"@sveltejs/adapter-auto": "^3.0.0",
2022
"@sveltejs/kit": "^2.15.0",
2123
"@sveltejs/vite-plugin-svelte": "^5.0.0",
24+
"@tailwindcss/forms": "0.5.9",
2225
"@types/eslint": "^9.6.0",
26+
"@types/node": "^22.10.2",
27+
"autoprefixer": "10.4.20",
2328
"eslint": "^9.0.0",
2429
"eslint-config-prettier": "^9.1.0",
2530
"eslint-plugin-svelte": "^2.36.0",
2631
"globals": "^15.0.0",
32+
"postcss": "8.4.49",
2733
"prettier": "^3.1.1",
2834
"prettier-plugin-svelte": "^3.1.2",
29-
"svelte": "^5.15.0",
35+
"svelte": "^5.38.3",
3036
"svelte-check": "^4.1.1",
37+
"tailwindcss": "3.4.17",
3138
"typescript": "^5.0.0",
3239
"typescript-eslint": "^8.0.0",
3340
"vite": "^6.0.5",
34-
"vitest": "^2.0.0",
35-
"postcss": "8.4.49",
36-
"autoprefixer": "10.4.20",
37-
"tailwindcss": "3.4.17",
38-
"@skeletonlabs/skeleton": "2.10.4",
39-
"@skeletonlabs/tw-plugin": "0.4.0",
4041
"vite-plugin-tailwind-purgecss": "0.3.5",
41-
"@tailwindcss/forms": "0.5.9",
42-
"@types/node": "22.10.2"
42+
"vitest": "^2.0.0"
4343
},
4444
"type": "module",
4545
"dependencies": {
46-
"@repo/ui": "*",
47-
"@floating-ui/dom": "1.6.12"
46+
"@floating-ui/dom": "1.6.12",
47+
"@repo/ui": "*"
4848
}
4949
}

‎new/apps/web/src/app.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!doctype html>
2-
<html lang="en" class="dark">
2+
<html lang="en" class="dark" data-theme="classic-mode">
33
<head>
44
<meta charset="utf-8" />
55
<link rel="icon" href="%sveltekit.assets%/favicon.png" />

‎new/apps/web/src/lib/common/ModalWidget.svelte‎

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1+
<!--
2+
A widget that expands into a modal view/pop up when clicked.
3+
-->
14
<script lang="ts">
5+
import { onMount } from "svelte";
6+
27
38
let {
49
title = 'Modal',
@@ -7,6 +12,9 @@
712
widgetContents,
813
modalContents,
914
} = $props();
15+
// TODO: support for "more info" is not currently
16+
// implemented. When it is, it should not make use
17+
// of IDs
1018
function infoClick(id: String) {
1119
let element = document.getElementById(id + '-info-table');
1220
if (element) {
@@ -27,9 +35,7 @@
2735
>
2836
<h1>{title}</h1>
2937
<div class="widget-values">
30-
<div class="widget-value">
3138
{@render widgetContents()}
32-
</div>
3339
</div>
3440
</div>
3541

@@ -66,3 +72,12 @@
6672
</div>
6773
</div>
6874
</div>
75+
76+
<style>
77+
.widget-values div {
78+
display: flex;
79+
flex-direction: column;
80+
flex-grow: 1;
81+
text-align: center;
82+
}
83+
</style>

new/apps/web/src/lib/components/widgets.svelte renamed to new/apps/web/src/lib/components/Widgets.svelte

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
<script lang="ts">
2-
import CPU from './widgets/Cpu.svelte';
3-
import RAM from './widgets/Ram.svelte';
2+
import Cpu from './widgets/Cpu.svelte';
3+
import Ram from './widgets/RAM.svelte';
44
import Motherboard from './widgets/Motherboard.svelte';
5-
import GPU from './widgets/Gpu.svelte';
6-
import OS from './widgets/Os.svelte';
7-
import NIC from './widgets/Nic.svelte';
5+
import Gpu from './widgets/Gpu.svelte';
6+
import Os from './widgets/Os.svelte';
7+
import Nic from './widgets/Nic.svelte';
88
99
import Drives from './widgets/Drives.svelte';
1010
@@ -18,7 +18,7 @@
1818
</script>
1919

2020
<div class="widgets-widgets widgets" id="hardware-widgets" data-hide="false">
21-
<CPU cpuData={rawJSON.Hardware.Cpu} />
21+
<!-- <CPU cpuData={rawJSON.Hardware.Cpu} />
2222
<RAM ramData={rawJSON.Hardware.Ram} pagefileData={rawJSON.System.PageFile} />
2323
<Motherboard
2424
tpmData={rawJSON.Security.Tpm}
@@ -27,17 +27,17 @@
2727
/>
2828
<GPU rawGPUData={rawJSON.Hardware.Gpu} rawMonitorData={rawJSON.Hardware.Monitors} />
2929
<OS securityData={rawJSON.Security} basicinfoData={rawJSON.BasicInfo} />
30-
<NIC nicData={rawJSON.Network.Adapters} />
30+
<NIC nicData={rawJSON.Network.Adapters} /> -->
3131
</div>
3232

3333
<div class="widgets-widgets widgets" data-hide="false">
3434
<Drives />
3535
</div>
3636

3737
<div class="widgets-widgets widgets" data-hide="false">
38-
<CpuUsage cpuloadData={rawJSON.Hardware.Cpu.LoadPercentage} />
38+
<!-- <CpuUsage cpuloadData={rawJSON.Hardware.Cpu.LoadPercentage} />
3939
<RamUsage runprocData={rawJSON.System.RunningProcesses} ramData={rawJSON.Hardware.Ram} />
40-
<Temps />
41-
<AudioDevices />
42-
<PowerProfiles />
40+
<Temps /> -->
41+
<AudioDevices audioDevices={rawJSON.Hardware.AudioDevices}/>
42+
<!-- <PowerProfiles /> -->
4343
</div>

‎new/apps/web/src/lib/components/widgets/AudioDevices.svelte‎

Lines changed: 46 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -16,48 +16,59 @@
1616
audioDevices
1717
}: Props = $props();
1818
19+
const numInternal = audioDevices.filter(
20+
d => d.DeviceID.toLowerCase().includes("hdaudio")
21+
).length;
22+
const numExternal = audioDevices.length - numInternal;
1923
</script>
20-
2124
<!-- Audio Devices -->
2225
<Widget title="Audio Devices" modalId="audio-modal">
2326
{#snippet widgetContents()}
24-
<!-- <?php
25-
$internalaudio = 0;
26-
$externalaudio = 0;
27-
foreach ($json_data['Hardware']['AudioDevices'] as $audioDevice) {
28-
if (str_contains(strtolower($audioDevice['DeviceID']), 'hdaudio')) {
29-
$internalaudio = $internalaudio + 1;
30-
} else {
31-
$externalaudio = $externalaudio + 1;
32-
};
33-
}
34-
echo '<div class="widget-value green">Internal : ' . $internalaudio . '</div>';
35-
echo '<div class="widget-value yellow">External : ' . $externalaudio . '</div>';
36-
?> -->
27+
<div class="widget-contents">
28+
<p class="green">Internal : {numInternal}</p>
29+
<p class="yellow">External : {numExternal}</p>
30+
</div>
31+
<style>
32+
</style>
3733
{/snippet}
38-
3934
{#snippet modalContents()}
40-
<div class="modal-body">
41-
<table id="audio-table" class="table">
42-
<thead>
35+
<table id="audio-table" class="table">
36+
<thead>
37+
<tr>
38+
<th>Device ID</th>
39+
<th>Manufacturer</th>
40+
<th>Name</th>
41+
<th>Status</th>
42+
</tr>
43+
</thead>
44+
<tbody>
45+
{#each audioDevices as audioDevice}
4346
<tr>
44-
<th>Device ID</th>
45-
<th>Manufacturer</th>
46-
<th>Name</th>
47-
<th>Status</th>
47+
<td>{audioDevice.DeviceID}</td>
48+
<td>{audioDevice.Manufacturer}</td>
49+
<td>{audioDevice.Name}</td>
50+
<td>{audioDevice.Status}</td>
4851
</tr>
49-
</thead>
50-
<tbody>
51-
{#each audioDevices as audioDevice}
52-
<tr>
53-
<td>{audioDevice.DeviceID}</td>
54-
<td>{audioDevice.Manufacturer}</td>
55-
<td>{audioDevice.Name}</td>
56-
<td>{audioDevice.Status}</td>
57-
</tr>
58-
{/each}
59-
</tbody>
60-
</table>
61-
</div>
52+
{/each}
53+
</tbody>
54+
</table>
6255
{/snippet}
6356
</Widget>
57+
58+
<style>
59+
/* TODO: fix table overflow */
60+
.widget-contents {
61+
display: flex;
62+
justify-content: space-around;
63+
width: 100%;
64+
}
65+
66+
table {
67+
width: 100%;
68+
}
69+
70+
td {
71+
white-space: nowrap !important;
72+
overflow: hidden;
73+
}
74+
</style>

new/apps/web/src/lib/components/widgets/cpu.svelte renamed to new/apps/web/src/lib/components/widgets/Cpu.svelte

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
<!-- NOT YET MIGRATED TO NEW WIDGET SYSTEM -->
2+
13
<script lang="ts">
24
import { onMount } from 'svelte';
35
import Widget from '../../common/ModalWidget.svelte';

‎new/apps/web/src/lib/components/widgets/CpuUsage.svelte‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<!-- NOT YET MIGRATED TO NEW WIDGET SYSTEM -->
12
<script lang="ts">
23
import Widget from '../../common/ModalWidget.svelte';
34

new/apps/web/src/lib/components/widgets/drives.svelte renamed to new/apps/web/src/lib/components/widgets/Drives.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<!-- NOT YET MIGRATED TO NEW WIDGET SYSTEM -->
12
<script lang="ts">
23
import Widget from '../../common/ModalWidget.svelte';
34
</script>

new/apps/web/src/lib/components/widgets/gpu.svelte renamed to new/apps/web/src/lib/components/widgets/Gpu.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<!-- NOT YET MIGRATED TO NEW WIDGET SYSTEM -->
12
<script lang="ts">
23
import Widget from '../../common/ModalWidget.svelte';
34

new/apps/web/src/lib/components/widgets/motherboard.svelte renamed to new/apps/web/src/lib/components/widgets/Motherboard.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<!-- NOT YET IMPLEMENTED IN NEW WIDGET SYSTEM -->
12
<script lang="ts">
23
import Widget from '../../common/ModalWidget.svelte';
34
import { lists } from '$lib/common/lists';

0 commit comments

Comments
 (0)