Fix calendar style

This commit is contained in:
2026-06-14 13:05:53 +02:00
parent 4924982a8a
commit 6ed2a3ae0c
10 changed files with 1005 additions and 31 deletions
+66 -7
View File
@@ -11,6 +11,7 @@ import { ProgressChart } from '@/components/dashboard/ProgressChart'
import { ParentalLeaveBreakdown } from '@/components/dashboard/ParentalLeaveBreakdown'
import { ChildBirthdayInput } from '@/components/inputs/ChildBirthdayInput'
import { QRCodeModal } from '@/components/modals/QRCodeModal'
import { ManualFetchModal } from '@/components/modals/ManualFetchModal'
export function Dashboard(): ReactNode {
const { workspace, isLoading: wsLoading, selectedChildId, children, personalDataUuid, refreshContext } = useWorkspace()
@@ -28,6 +29,9 @@ export function Dashboard(): ReactNode {
const [isSubmitting, setIsSubmitting] = useState(false)
const [submitError, setSubmitError] = useState<string | null>(null)
const [showModal, setShowModal] = useState(false)
const [showManualFetchModal, setShowManualFetchModal] = useState(false)
const [isManualFetchSaving, setIsManualFetchSaving] = useState(false)
const [manualFetchError, setManualFetchError] = useState<string | null>(null)
const isLoading = wsLoading || analyticsLoading || pdLoading || bpLoading
@@ -64,6 +68,44 @@ export function Dashboard(): ReactNode {
await scraper.start(selectedChildId ?? undefined)
}
const handleSaveManualFetch = async (data: {
totalDays: number
daysUsed: number
reservedDaysLeft: number
transferableDaysLeft: number
dubbeldagarLeft: number
sjukpenningUsed: number
lagstaNivaUsed: number
}) => {
if (!workspace?.id || !selectedChildId || !personalDataUuid) return
try {
setIsManualFetchSaving(true)
setManualFetchError(null)
await api.saveManualFetch({
personalDataUuid,
workspaceId: workspace.id,
childId: selectedChildId,
totalDays: data.totalDays,
daysUsed: data.daysUsed,
reservedDaysLeft: data.reservedDaysLeft,
transferableDaysLeft: data.transferableDaysLeft,
dubbeldagarLeft: data.dubbeldagarLeft,
sjukpenningUsed: data.sjukpenningUsed,
lagstaNivaUsed: data.lagstaNivaUsed,
})
await refreshParentalLeave()
await refreshAnalytics()
setShowManualFetchModal(false)
} catch (err) {
setManualFetchError(err instanceof Error ? err.message : 'Failed to save manual data')
} finally {
setIsManualFetchSaving(false)
}
}
const handleModalClose = () => {
if (scraper.isRunning) return
setShowModal(false)
@@ -135,13 +177,22 @@ export function Dashboard(): ReactNode {
)}
<section className="dashboard__section">
<button
onClick={handleFetchFK}
disabled={!selectedChildId}
style={{ padding: '0.5rem 1rem', cursor: selectedChildId ? 'pointer' : 'not-allowed' }}
>
Hämta från Försäkringskassan
</button>
<div style={{ display: 'flex', gap: '10px' }}>
<button
onClick={handleFetchFK}
disabled={!selectedChildId}
style={{ padding: '0.5rem 1rem', cursor: selectedChildId ? 'pointer' : 'not-allowed' }}
>
Hämta från Försäkringskassan
</button>
<button
onClick={() => setShowManualFetchModal(true)}
disabled={!selectedChildId}
style={{ padding: '0.5rem 1rem', cursor: selectedChildId ? 'pointer' : 'not-allowed' }}
>
Ange uppgifter manuellt
</button>
</div>
</section>
<section className="dashboard__section">
@@ -199,6 +250,14 @@ export function Dashboard(): ReactNode {
isRunning={scraper.isRunning}
onCancel={scraper.cancel}
/>
<ManualFetchModal
isOpen={showManualFetchModal}
onSave={handleSaveManualFetch}
onClose={() => setShowManualFetchModal(false)}
isSaving={isManualFetchSaving}
error={manualFetchError}
/>
</div>
</Layout>
)
+53
View File
@@ -25,6 +25,7 @@ export function Settings(): ReactNode {
)
const [saveMessage, setSaveMessage] = useState<{ type: 'success' | 'error'; text: string } | null>(null)
const [isSaving, setIsSaving] = useState(false)
const [newPartnerName, setNewPartnerName] = useState('')
const isLoading = wsLoading || vacLoading || bpLoading
@@ -163,6 +164,30 @@ export function Settings(): ReactNode {
}
}
const handleAddPartner = async () => {
if (!newPartnerName.trim() || !workspace?.id) {
setSaveMessage({ type: 'error', text: 'Please enter a partner name' })
return
}
try {
setIsSaving(true)
setSaveMessage(null)
await api.addPartner(workspace.id, newPartnerName)
await refreshContext()
setNewPartnerName('')
setSaveMessage({ type: 'success', text: 'Partner added! Refresh the page to see changes.' })
setTimeout(() => setSaveMessage(null), 3000)
} catch (err) {
setSaveMessage({
type: 'error',
text: err instanceof Error ? err.message : 'Failed to add partner',
})
} finally {
setIsSaving(false)
}
}
return (
<Layout>
<div data-testid="settings-page" className="settings-page">
@@ -258,6 +283,34 @@ export function Settings(): ReactNode {
onRemove={handleRemoveBreakPeriod}
/>
</section>
<section className="settings-page__section">
<h2>Partner</h2>
<p>Add a partner to plan parental leave together.</p>
<div style={{ display: 'flex', gap: '8px' }}>
<input
type="text"
placeholder="Partner name"
value={newPartnerName}
onChange={(e) => setNewPartnerName(e.target.value)}
disabled={isSaving}
style={{
flex: 1,
padding: '8px 10px',
border: '1px solid #d0d0d0',
borderRadius: '4px',
}}
/>
<button
onClick={handleAddPartner}
className="settings-page__button"
disabled={isSaving}
data-testid="add-partner-button"
>
{isSaving ? 'Adding...' : 'Lägg till partner'}
</button>
</div>
</section>
</div>
</Layout>
)