This commit is contained in:
Randa Firman Putra
2025-07-15 21:41:39 +07:00
parent 01f773dfb0
commit efe371ce03
26 changed files with 300 additions and 302 deletions

View File

@@ -19,7 +19,7 @@ interface Props {
}
export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
const { theme, systemTheme } = useTheme();
const { theme } = useTheme();
const [mounted, setMounted] = useState(false);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
@@ -139,18 +139,17 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
// Update theme when it changes
useEffect(() => {
const currentTheme = theme === 'system' ? systemTheme : theme;
setOptions(prev => ({
...prev,
chart: {
...prev.chart,
background: currentTheme === 'dark' ? '#0F172B' : '#fff',
background: theme === 'dark' ? '#0F172B' : '#fff',
},
dataLabels: {
...prev.dataLabels,
style: {
...prev.dataLabels?.style,
colors: [currentTheme === 'dark' ? '#fff' : '#000']
colors: [theme === 'dark' ? '#fff' : '#000']
}
},
xaxis: {
@@ -159,14 +158,14 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
...prev.xaxis?.title,
style: {
...prev.xaxis?.title?.style,
color: currentTheme === 'dark' ? '#fff' : '#000'
color: theme === 'dark' ? '#fff' : '#000'
}
},
labels: {
...prev.xaxis?.labels,
style: {
...prev.xaxis?.labels?.style,
colors: currentTheme === 'dark' ? '#fff' : '#000'
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
@@ -176,23 +175,23 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
...(Array.isArray(prev.yaxis) ? prev.yaxis[0]?.title : prev.yaxis?.title),
style: {
...(Array.isArray(prev.yaxis) ? prev.yaxis[0]?.title?.style : prev.yaxis?.title?.style),
color: currentTheme === 'dark' ? '#fff' : '#000'
color: theme === 'dark' ? '#fff' : '#000'
}
},
labels: {
...(Array.isArray(prev.yaxis) ? prev.yaxis[0]?.labels : prev.yaxis?.labels),
style: {
...(Array.isArray(prev.yaxis) ? prev.yaxis[0]?.labels?.style : prev.yaxis?.labels?.style),
colors: currentTheme === 'dark' ? '#fff' : '#000'
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
tooltip: {
...prev.tooltip,
theme: currentTheme === 'dark' ? 'dark' : 'light'
theme: theme === 'dark' ? 'dark' : 'light'
}
}));
}, [theme, systemTheme]);
}, [theme]);
useEffect(() => {
setMounted(true);