lvl0/buckets
1
0
Fork 0
Code Issues 11 Pull requests 1 Projects Releases Packages Wiki Activity Actions

2 - Fix stale edit modal and green bar threshold

Browse source
This commit is contained in:
myrmidex 2026-03-22 17:07:15 +01:00
parent a07d916663
commit 98d355e811
2 changed files with 17 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/js/components/DigitalProgressBar.tsx
View file

@ -8,13 +8,13 @@ const BAR_COUNT = 20;
function getGlow(index: number): string { function getGlow(index: number): string {
if (index < 10) return '0 0 8px rgba(239, 68, 68, 0.6)'; if (index < 10) return '0 0 8px rgba(239, 68, 68, 0.6)';
if (index < 18) return '0 0 8px rgba(249, 115, 22, 0.6)'; if (index < BAR_COUNT - 1) return '0 0 8px rgba(249, 115, 22, 0.6)';
return '0 0 8px rgba(34, 197, 94, 0.6)'; return '0 0 8px rgba(34, 197, 94, 0.6)';
} }
function getBarColor(index: number): string { function getBarColor(index: number): string {
if (index < 10) return 'bg-red-500'; if (index < 10) return 'bg-red-500';
if (index < 18) return 'bg-orange-500'; if (index < BAR_COUNT - 1) return 'bg-orange-500';
return 'bg-green-500'; return 'bg-green-500';
} }

16
resources/js/pages/Scenarios/Show.tsx
View file

@ -1,6 +1,6 @@
import { Head, router } from '@inertiajs/react'; import { Head, router } from '@inertiajs/react';
import { Settings } from 'lucide-react'; import { Settings } from 'lucide-react';
import { useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
import BucketCard from '@/components/BucketCard'; import BucketCard from '@/components/BucketCard';
import DistributionLines from '@/components/DistributionLines'; import DistributionLines from '@/components/DistributionLines';
import InlineEditInput from '@/components/InlineEditInput'; import InlineEditInput from '@/components/InlineEditInput';
@ -66,6 +66,20 @@ export default function Show({ scenario, buckets }: Props) {
const [isDistributing, setIsDistributing] = useState(false); const [isDistributing, setIsDistributing] = useState(false);
const [isSaving, setIsSaving] = useState(false); const [isSaving, setIsSaving] = useState(false);
const [distributionError, setDistributionError] = useState<string | null>(null); const [distributionError, setDistributionError] = useState<string | null>(null);
// Sync editingBucket with refreshed props after inline edits.
// Only react to buckets changing, not editingBucket — reading .id is stable.
useEffect(() => {
if (editingBucket) {
const updated = buckets.data.find(b => b.id === editingBucket.id);
if (updated) {
setEditingBucket(updated);
} else {
setEditingBucket(null);
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [buckets]);
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const incomeRef = useRef<HTMLDivElement>(null); const incomeRef = useRef<HTMLDivElement>(null);
const bucketRefs = useRef<Map<string, HTMLElement>>(new Map()); const bucketRefs = useRef<Map<string, HTMLElement>>(new Map());