watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-09 23:27:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

checkpoint

Browse source
This commit is contained in:
Brian Cao 2023-05-18 11:17:35 -07:00
parent cb038a51f3
commit de509e7ccc
23 changed files with 335 additions and 236 deletions
Download patch file Download diff file Expand all files Collapse all files

114
components/pages/reports/FunnelForm.js
View file

@ -1,114 +0,0 @@
import DateFilter from 'components/input/DateFilter';
import WebsiteSelect from 'components/input/WebsiteSelect';
import useMessages from 'hooks/useMessages';
import { parseDateRange } from 'lib/date';
import { useState } from 'react';
import {
Button,
Form,
FormButtons,
FormInput,
FormRow,
SubmitButton,
TextField,
} from 'react-basics';
import styles from './FunnelForm.module.css';
export function FunnelForm({ onSearch }) {
const { formatMessage, labels } = useMessages();
const [dateRange, setDateRange] = useState('');
const [startAt, setStartAt] = useState();
const [endAt, setEndAt] = useState();
const [urls, setUrls] = useState(['/', '/docs/getting-started', '/docs/intall']);
const [websiteId, setWebsiteId] = useState('');
const [window, setWindow] = useState(60);
const handleSubmit = async data => {
onSearch(data);
};
const handleDateChange = value => {
const { startDate, endDate } = parseDateRange(value);
setDateRange(value);
setStartAt(startDate.getTime());
setEndAt(endDate.getTime());
};
const handleAddUrl = () => setUrls([...urls, '']);
const handleRemoveUrl = i => setUrls(urls.splice(i, 1));
const handleWindowChange = value => setWindow(value.target.value);
const handleUrlChange = (value, i) => {
const nextUrls = [...urls];
nextUrls[i] = value.target.value;
setUrls(nextUrls);
};
return (
<>
<Form
values={{
websiteId,
startAt,
endAt,
urls,
window,
}}
onSubmit={handleSubmit}
>
<FormRow label={formatMessage(labels.website)}>
<WebsiteSelect websiteId={websiteId} onSelect={value => setWebsiteId(value)} />
<FormInput name="websiteId" rules={{ required: formatMessage(labels.required) }}>
<TextField value={websiteId} className={styles.hiddenInput} />
</FormInput>
</FormRow>
<FormRow label="Date">
<DateFilter
className={styles.filter}
value={dateRange}
alignment="start"
onChange={handleDateChange}
isF
/>
<FormInput
name="startAt"
className={styles.hiddenInput}
rules={{ required: formatMessage(labels.required) }}
>
<TextField value={startAt} />
</FormInput>
<FormInput name="endAt" rules={{ required: formatMessage(labels.required) }}>
<TextField value={endAt} className={styles.hiddenInput} />
</FormInput>
</FormRow>
<FormRow label="Window (minutes)">
<FormInput
name="window"
rules={{ required: formatMessage(labels.required), pattern: /[0-9]+/ }}
>
<TextField value={window} onChange={handleWindowChange} />
</FormInput>
</FormRow>
<Button onClick={handleAddUrl}>Add URL</Button>
{urls.map((a, i) => (
<FormRow className={styles.urlFormRow} key={`url${i}`} label={`URL ${i + 1}`}>
<TextField value={urls[i]} onChange={value => handleUrlChange(value, i)} />
<Button onClick={() => handleRemoveUrl(i)}>Remove URL</Button>
</FormRow>
))}
<FormButtons>
<SubmitButton variant="primary" disabled={false}>
Search
</SubmitButton>
</FormButtons>
</Form>
</>
);
}
export default FunnelForm;