67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { useCallback, useEffect, useState } from 'react';
|
|
import LoadFileForm from './LoadFileForm';
|
|
import { fetchConfig, loadTransactions } from '../../services/api.service';
|
|
import { useStore } from '../../store/AppStore';
|
|
|
|
export default function LoadFilePage() {
|
|
const { dispatch } = useStore();
|
|
|
|
const [profiles, setProfiles] = useState<string[]>([]);
|
|
const [servers, setServers] = useState<string[]>([]);
|
|
const [defaultProfile, setDefaultProfile] = useState<string|undefined>(undefined);
|
|
const [defaultServer, setDefaultServer] = useState<string|undefined>(undefined);
|
|
|
|
const loadConfig = useCallback(async () => {
|
|
const config = await fetchConfig();
|
|
|
|
setProfiles(config.profiles);
|
|
setServers(config.servers);
|
|
setDefaultProfile(config.defaultProfile);
|
|
setDefaultServer(config.defaultServer);
|
|
|
|
dispatch({
|
|
type: 'UPDATE_CONFIG',
|
|
payload: config
|
|
});
|
|
}, [setProfiles, setServers, setDefaultProfile, setDefaultServer]);
|
|
|
|
useEffect(() => {
|
|
loadConfig();
|
|
}, [loadConfig]);
|
|
|
|
const handleSubmit = useCallback(async (csvFile: File, profile: string, server: string) => {
|
|
const data = await loadTransactions(csvFile, profile, server);
|
|
|
|
dispatch({
|
|
type: 'UPDATE_DATA',
|
|
payload: {
|
|
profile,
|
|
server,
|
|
...data
|
|
}
|
|
});
|
|
|
|
dispatch({
|
|
type: 'MOVE_STEP',
|
|
payload: {
|
|
offset: 1
|
|
}
|
|
});
|
|
}, []);
|
|
|
|
return (
|
|
<div className="columns mt-6">
|
|
<div className="column is-6 is-offset-3">
|
|
<div className="box">
|
|
<h2 className="title is-4 has-text-centered">Import Transactions</h2>
|
|
<LoadFileForm
|
|
profiles={profiles}
|
|
servers={servers}
|
|
defaultProfile={defaultProfile}
|
|
defaultServer={defaultServer}
|
|
onSubmit={handleSubmit} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
} |