jbrueckner/GhostGrid
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: lighter input styles in Settings, show required redirect URI for Azure

Browse Source
This commit is contained in:
Brückner
2026-06-03 16:35:21 +02:00
parent 550acd27b2
commit c879f84843
2 changed files with 27 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/Settings.tsx
View File

@ -77,7 +77,7 @@ function Input({ value, onChange, placeholder, monospace, icon }: {
value={value}
onChange={e => onChange(e.target.value)}
placeholder={placeholder}
className={`w-full bg-slate-950 border border-slate-800 rounded-lg py-2.5 text-sm text-white placeholder-slate-600 focus:outline-none focus:ring-1 focus:ring-cyan-500/40 focus:border-cyan-500/40 transition-all ${icon ? 'pl-9 pr-3' : 'px-3'} ${monospace ? 'font-mono text-xs' : ''}`}
className={`w-full bg-slate-900 border border-slate-700 rounded-lg py-2.5 text-sm text-white placeholder-slate-500 focus:outline-none focus:ring-2 focus:ring-cyan-500/50 focus:border-cyan-500/50 transition-all ${icon ? 'pl-9 pr-3' : 'px-3'} ${monospace ? 'font-mono text-xs' : ''}`}
/>
</div>
);
@ -100,7 +100,7 @@ function SecretInput({ value, onChange, alreadySet, show, onToggleShow }: {
value={value}
onChange={e => onChange(e.target.value)}
placeholder={alreadySet ? '•••••••• (leave blank to keep)' : 'Paste secret value'}
className="w-full bg-slate-950 border border-slate-800 rounded-lg pl-9 pr-10 py-2.5 text-xs font-mono text-white placeholder-slate-600 focus:outline-none focus:ring-1 focus:ring-cyan-500/40 focus:border-cyan-500/40 transition-all"
className="w-full bg-slate-900 border border-slate-700 rounded-lg pl-9 pr-10 py-2.5 text-xs font-mono text-white placeholder-slate-500 focus:outline-none focus:ring-2 focus:ring-cyan-500/50 focus:border-cyan-500/50 transition-all"
/>
<button
type="button"
@ -134,6 +134,8 @@ export default function Settings({ currentUser: _currentUser }: SettingsProps) {
const [error, setError] = useState('');
const [successMsg, setSuccessMsg] = useState('');
const [effectiveRedirectUri, setEffectiveRedirectUri] = useState('');
const [azureEnabled, setAzureEnabled] = useState(false);
const [azureClientId, setAzureClientId] = useState('');
const [azureTenantId, setAzureTenantId] = useState('');
@ -148,7 +150,13 @@ export default function Settings({ currentUser: _currentUser }: SettingsProps) {
const [checkmkSyncInterval, setCheckmkSyncInterval] = useState('60000');
const [showCheckmkSecret, setShowCheckmkSecret] = useState(false);
useEffect(() => { loadSettings(); }, []);
useEffect(() => {
loadSettings();
fetch('/api/auth/config')
.then(r => r.json())
.then(d => { if (d.effectiveRedirectUri) setEffectiveRedirectUri(d.effectiveRedirectUri); })
.catch(() => {});
}, []);
async function loadSettings() {
setLoading(true);
@ -317,6 +325,16 @@ export default function Settings({ currentUser: _currentUser }: SettingsProps) {
monospace
icon={<ExternalLink className="w-3.5 h-3.5" />}
/>
{effectiveRedirectUri && (
<div className="mt-2 flex items-start gap-2 bg-amber-950/30 border border-amber-900/40 rounded-lg px-3 py-2">
<span className="text-amber-400 mt-0.5 shrink-0">⚠</span>
<div className="min-w-0">
<p className="text-[10px] text-amber-300 font-semibold mb-0.5">Register this URI in Azure Portal</p>
<p className="text-[10px] font-mono text-amber-200 break-all">{effectiveRedirectUri}</p>
<p className="text-[10px] text-amber-400/70 mt-0.5">App registrations → Authentication → Redirect URIs</p>
</div>
</div>
)}
</FieldRow>
</div>
</SectionCard>