Skip to content

Commit 1a54f25

Browse files
am9zZWYam9zZWY
committed
Update UX and add stability
1 parent 560fde7 commit 1a54f25

8 files changed

Lines changed: 148 additions & 162 deletions

File tree

‎src/app/admin/manage/database/page.tsx‎

Lines changed: 23 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -27,15 +27,17 @@ export default function ManagePage() {
2727
return;
2828
}
2929

30-
fetch('/api/system/reset', {
31-
method: 'POST',
32-
credentials: 'include',
33-
})
34-
.then(() => setMessage('Database prepared'))
35-
.catch((error) => {
36-
console.error('Error preparing database', error);
37-
setMessage(error => error)
30+
if (window.confirm(`Are you sure you want to RESET the database? THIS ACTION IS NOT REVERSIBLE!!`)) {
31+
fetch('/api/system/reset', {
32+
method: 'POST',
33+
credentials: 'include',
3834
})
35+
.then(() => setMessage('Database prepared'))
36+
.catch((error) => {
37+
console.error('Error preparing database', error);
38+
setMessage(error => error)
39+
})
40+
}
3941
}
4042

4143
const { data, error, isFetching } = useSystem();
@@ -98,7 +100,7 @@ export default function ManagePage() {
98100
<Heading
99101
title={t('Admin.Manage.Database.title')}
100102
description={message}
101-
icon={<Database className="size-10 text-blue-600"/>}
103+
icon={<Database className="size-10 text-primary-600"/>}
102104
/>
103105

104106
<div className="max-w-4xl mx-auto p-6">
@@ -129,14 +131,6 @@ export default function ManagePage() {
129131

130132
{/* Action Buttons */}
131133
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
132-
<Button
133-
onClick={resetSystem}
134-
className="inline-flex items-center justify-center gap-2 rounded-2xl px-6 py-3 text-sm font-medium transition-all duration-200 bg-slate-200 text-slate-700 hover:bg-slate-300 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-slate-500 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-slate-200"
135-
disabled={!enableChanges}
136-
>
137-
{t('Admin.Manage.Database.Actions.reset_database')}
138-
</Button>
139-
140134
{data && (
141135
<Button
142136
className={`inline-flex items-center justify-center gap-2 rounded-2xl px-6 py-3 text-sm font-medium transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed ${
@@ -170,7 +164,7 @@ export default function ManagePage() {
170164
name="systemMessage"
171165
value={systemMessage}
172166
placeholder={t('Admin.Manage.Database.Actions.enterSystemMessage')}
173-
className="w-full px-4 py-3 pl-11 text-sm bg-white border-2 border-slate-300 rounded-2xl shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 hover:border-slate-400 placeholder-slate-400"
167+
className="w-full px-4 py-3 pl-11 text-sm bg-white border-2 border-slate-300 rounded-2xl shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 hover:border-slate-400 placeholder-slate-400"
174168
onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSystemMessage(e.target.value)}
175169
/>
176170
<div
@@ -211,7 +205,7 @@ export default function ManagePage() {
211205
</h3>
212206
<Button
213207
onClick={saveConfig}
214-
className="inline-flex items-center gap-2 rounded-2xl px-4 py-2 text-xs font-medium transition-all duration-200 bg-blue-600 text-white hover:bg-blue-700 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
208+
className="inline-flex items-center gap-2 rounded-2xl px-4 py-2 text-xs font-medium transition-all duration-200 bg-primary-600 text-white hover:bg-primary-700 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
215209
>
216210
{t('Admin.Manage.Database.Actions.saveConfig')}
217211
</Button>
@@ -223,7 +217,7 @@ export default function ManagePage() {
223217
onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => {
224218
setConfigData(e.target.value);
225219
}}
226-
className="w-full h-80 p-4 text-sm font-mono bg-slate-900 text-slate-100 rounded-2xl border-2 border-slate-300 resize-none focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent placeholder-slate-400"
220+
className="w-full h-80 p-4 text-sm font-mono bg-slate-900 text-slate-100 rounded-2xl border-2 border-slate-300 resize-none focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent placeholder-slate-400"
227221
placeholder="Enter your JSON configuration here..."
228222
spellCheck={false}
229223
/>
@@ -237,6 +231,15 @@ export default function ManagePage() {
237231
{t('Admin.Manage.Database.ConfigurationEditor.disclaimer')}
238232
</div>
239233
</div>
234+
<div className="p-6 space-y-6">
235+
<Button
236+
onClick={resetSystem}
237+
className="inline-flex items-center justify-center gap-2 rounded-2xl px-6 py-3 text-sm font-medium transition-all duration-200 bg-slate-200 text-slate-700 hover:bg-slate-300 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-slate-500 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-slate-200"
238+
disabled={!enableChanges}
239+
>
240+
{t('Admin.Manage.Database.Actions.reset_database')}
241+
</Button>
242+
</div>
240243
</div>
241244
</div>
242245
</div>

0 commit comments

Comments
 (0)