Skip to content

Commit db0b0ce

Browse files
fullstackjamfullstackjam
committed
fix: resolve 6 issues from dashboard redesign review
1. macOS prefs catalog now stays open after adding first pref (was auto-closing because showPrefCatalog remained false) 2. Light mode CSS fixed — replaced all [data-theme='light'] selectors with CSS variables. Svelte scoped CSS can't match data-theme on <body>, so all 14 light-mode overrides were dead code. 3. Unified search uses Promise.allSettled instead of Promise.all — if npm API fails, homebrew results still show (and vice versa) 4. Slug "new" conflict resolved — create route now uses /_new to avoid collision with configs that slugify to "new" 5. Removed dead getTypeColor function from PackageManager 6. Removed unused .prefs-empty CSS selector
1 parent 9f38751 commit db0b0ce

5 files changed

Lines changed: 28 additions & 98 deletions

File tree

‎src/lib/components/ConfigCard.svelte‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -325,10 +325,6 @@
325325
overflow: hidden;
326326
}
327327
328-
[data-theme='light'] .terminal {
329-
background: #1a1a2e;
330-
}
331-
332328
.term-chrome {
333329
display: flex;
334330
gap: 5px;

‎src/lib/components/ConfigEditor.svelte‎

Lines changed: 16 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -204,6 +204,8 @@
204204
desc: item.description,
205205
},
206206
];
207+
// Keep catalog open so user can continue adding
208+
showPrefCatalog = true;
207209
}
208210
}
209211
@@ -780,7 +782,7 @@
780782
}
781783
782784
.identity-glass {
783-
background: rgba(10, 10, 10, 0.75);
785+
background: color-mix(in srgb, var(--bg-primary) 80%, transparent);
784786
backdrop-filter: blur(20px);
785787
-webkit-backdrop-filter: blur(20px);
786788
border-radius: 17px;
@@ -790,14 +792,10 @@
790792
gap: 12px;
791793
}
792794
793-
[data-theme='light'] .identity-glass {
794-
background: rgba(255, 255, 255, 0.8);
795-
}
796-
797795
.name-input {
798796
background: none;
799797
border: none;
800-
color: #fff;
798+
color: var(--text-primary);
801799
font-size: 2.2rem;
802800
font-weight: 800;
803801
font-family: inherit;
@@ -807,39 +805,25 @@
807805
width: 100%;
808806
}
809807
810-
[data-theme='light'] .name-input {
811-
color: var(--text-primary);
812-
}
813-
814808
.name-input::placeholder {
815-
color: rgba(255, 255, 255, 0.3);
816-
}
817-
818-
[data-theme='light'] .name-input::placeholder {
819809
color: var(--text-muted);
810+
opacity: 0.5;
820811
}
821812
822813
.desc-input {
823814
background: none;
824815
border: none;
825-
color: rgba(255, 255, 255, 0.7);
816+
color: var(--text-secondary);
826817
font-size: 1.05rem;
827818
font-family: inherit;
828819
outline: none;
829820
padding: 0;
830821
width: 100%;
831822
}
832823
833-
[data-theme='light'] .desc-input {
834-
color: var(--text-secondary);
835-
}
836-
837824
.desc-input::placeholder {
838-
color: rgba(255, 255, 255, 0.25);
839-
}
840-
841-
[data-theme='light'] .desc-input::placeholder {
842825
color: var(--text-muted);
826+
opacity: 0.5;
843827
}
844828
845829
.identity-row {
@@ -854,57 +838,37 @@
854838
.vis-pills {
855839
display: flex;
856840
gap: 0;
857-
border: 1px solid rgba(255, 255, 255, 0.15);
841+
border: 1px solid var(--border);
858842
border-radius: 10px;
859843
overflow: hidden;
860844
}
861845
862-
[data-theme='light'] .vis-pills {
863-
border-color: var(--border);
864-
}
865-
866846
.vis-pill {
867847
padding: 8px 16px;
868-
background: rgba(255, 255, 255, 0.06);
848+
background: var(--bg-tertiary);
869849
border: none;
870-
color: rgba(255, 255, 255, 0.5);
850+
color: var(--text-muted);
871851
font-size: 0.78rem;
872852
font-weight: 600;
873853
font-family: inherit;
874854
cursor: pointer;
875855
text-transform: capitalize;
876856
transition: all 0.15s;
877-
border-right: 1px solid rgba(255, 255, 255, 0.1);
878-
}
879-
880-
[data-theme='light'] .vis-pill {
881-
background: var(--bg-tertiary);
882-
color: var(--text-muted);
883-
border-right-color: var(--border);
857+
border-right: 1px solid var(--border);
884858
}
885859
886860
.vis-pill:last-child {
887861
border-right: none;
888862
}
889863
890864
.vis-pill:hover {
891-
color: rgba(255, 255, 255, 0.8);
892-
background: rgba(255, 255, 255, 0.1);
893-
}
894-
895-
[data-theme='light'] .vis-pill:hover {
896865
color: var(--text-secondary);
897866
background: var(--bg-hover);
898867
}
899868
900869
.vis-pill.active {
901-
background: rgba(255, 255, 255, 0.95);
902-
color: #000;
903-
}
904-
905-
[data-theme='light'] .vis-pill.active {
906870
background: var(--accent);
907-
color: #fff;
871+
color: #000;
908872
}
909873
910874
.alias-field {
@@ -914,39 +878,25 @@
914878
}
915879
916880
.alias-prefix {
917-
color: rgba(255, 255, 255, 0.4);
881+
color: var(--text-muted);
918882
font-size: 0.82rem;
919883
white-space: nowrap;
920884
}
921885
922-
[data-theme='light'] .alias-prefix {
923-
color: var(--text-muted);
924-
}
925-
926886
.alias-input {
927887
width: 120px;
928888
padding: 8px 10px;
929-
background: rgba(255, 255, 255, 0.08);
930-
border: 1px solid rgba(255, 255, 255, 0.12);
889+
background: var(--bg-tertiary);
890+
border: 1px solid var(--border);
931891
border-radius: 8px;
932-
color: #fff;
892+
color: var(--text-primary);
933893
font-size: 0.82rem;
934894
font-family: 'JetBrains Mono', monospace;
935895
outline: none;
936896
transition: border-color 0.2s;
937897
}
938898
939-
[data-theme='light'] .alias-input {
940-
background: var(--bg-tertiary);
941-
border-color: var(--border);
942-
color: var(--text-primary);
943-
}
944-
945899
.alias-input:focus {
946-
border-color: rgba(255, 255, 255, 0.4);
947-
}
948-
949-
[data-theme='light'] .alias-input:focus {
950900
border-color: var(--accent);
951901
}
952902
@@ -1206,17 +1156,6 @@
12061156
color: var(--danger);
12071157
}
12081158
1209-
.prefs-empty {
1210-
text-align: center;
1211-
padding: 20px;
1212-
color: var(--text-muted);
1213-
font-size: 0.82rem;
1214-
background: var(--bg-tertiary);
1215-
border: 1px dashed var(--border);
1216-
border-radius: 10px;
1217-
margin: 0;
1218-
}
1219-
12201159
.custom-pref-toggle {
12211160
background: none;
12221161
border: none;

‎src/lib/components/PackageManager.svelte‎

Lines changed: 7 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -42,15 +42,16 @@
4242
}
4343
searchLoading = true;
4444
try {
45-
const [brewRes, npmRes] = await Promise.all([
45+
const [brewRes, npmRes] = await Promise.allSettled([
4646
fetch(`/api/homebrew/search?q=${encodeURIComponent(query)}`).then((r) => r.json()),
4747
fetch(`/api/npm/search?q=${encodeURIComponent(query)}`).then((r) => r.json()),
4848
]);
49-
const brew: SearchResult[] = brewRes.results || [];
50-
const npm: SearchResult[] = (npmRes.results || []).map((r: any) => ({
51-
...r,
52-
type: 'npm' as const,
53-
}));
49+
const brew: SearchResult[] =
50+
brewRes.status === 'fulfilled' ? brewRes.value.results || [] : [];
51+
const npm: SearchResult[] =
52+
npmRes.status === 'fulfilled'
53+
? (npmRes.value.results || []).map((r: any) => ({ ...r, type: 'npm' as const }))
54+
: [];
5455
searchResults = [...brew, ...npm];
5556
5657
if (isTapPackage(query) && !searchResults.some((r) => r.name === query)) {
@@ -92,12 +93,6 @@
9293
{ key: 'full', label: 'Full', desc: 'Everything' },
9394
];
9495
95-
function getTypeColor(type: string): string {
96-
if (type === 'cask') return '#3b82f6';
97-
if (type === 'npm') return '#f97316';
98-
return '#22c55e';
99-
}
100-
10196
async function importBrewfile() {
10297
if (!brewfileContent.trim()) {
10398
importError = 'Paste your Brewfile content';

‎src/routes/dashboard/+page.svelte‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@
9494
snapshot: source.snapshot || null,
9595
})
9696
);
97-
goto('/dashboard/edit/new');
97+
goto('/dashboard/edit/_new');
9898
} catch {
9999
alert('Failed to duplicate');
100100
}
@@ -241,7 +241,7 @@
241241
})),
242242
})
243243
);
244-
goto('/dashboard/edit/new');
244+
goto('/dashboard/edit/_new');
245245
} catch {
246246
importError = 'Failed to parse Brewfile';
247247
} finally {
@@ -275,7 +275,7 @@
275275
<Button variant="secondary" onclick={() => (showImportModal = true)}>
276276
Import Brewfile
277277
</Button>
278-
<Button variant="primary" onclick={() => goto('/dashboard/edit/new')}>
278+
<Button variant="primary" onclick={() => goto('/dashboard/edit/_new')}>
279279
+ New Config
280280
</Button>
281281
</div>
@@ -296,7 +296,7 @@
296296
<p class="empty-desc">
297297
Define your machine's DNA. Create a config to get a custom install URL.
298298
</p>
299-
<Button variant="primary" onclick={() => goto('/dashboard/edit/new')}>
299+
<Button variant="primary" onclick={() => goto('/dashboard/edit/_new')}>
300300
Create First Config
301301
</Button>
302302
</div>

‎src/routes/dashboard/edit/[slug]/+page.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import ConfigEditor from '$lib/components/ConfigEditor.svelte';
33
44
let { data } = $props();
5-
const slug = $derived(data.slug === 'new' ? undefined : data.slug);
5+
const slug = $derived(data.slug === '_new' ? undefined : data.slug);
66
</script>
77

88
<ConfigEditor {slug} />

0 commit comments

Comments
 (0)