yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-12-27 01:48:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ingestion) Update managed ingestion scheduler to be easier to use (#5559)

Browse Source
This commit is contained in:
Chris Collins 2022-08-03 20:16:20 -04:00 committed by GitHub
parent 76b40b0946
commit 9a3ee1cb6b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
datahub-web-react/package.json
View File

@ -75,6 +75,7 @@
"react-color": "^2.19.3",
"react-dom": "^17.0.0",
"react-icons": "4.3.1",
"react-js-cron": "^2.1.0",
"react-router": "^5.2.0",
"react-router-dom": "^5.1.6",
"react-scripts": "4.0.3",

31
datahub-web-react/src/app/ingest/source/builder/CreateScheduleStep.tsx
View File

@ -1,5 +1,7 @@
import { Button, Form, Input, Typography } from 'antd';
import { Button, Form, Typography } from 'antd';
import React, { useMemo } from 'react';
import { Cron } from 'react-js-cron';
import 'react-js-cron/dist/styles.css';
import styled from 'styled-components';
import cronstrue from 'cronstrue';
import { CheckCircleOutlined } from '@ant-design/icons';
@ -24,7 +26,6 @@ const SelectTemplateHeader = styled(Typography.Title)`
const CronText = styled(Typography.Paragraph)`
&&& {
margin-top: 8px;
margin-bottom: 0px;
}
color: ${ANTD_GRAY[7]};
@ -41,10 +42,21 @@ const ControlsContainer = styled.div`
margin-top: 8px;
`;
const StyledFormItem = styled(Form.Item)`
.cron-builder {
color: ${ANTD_GRAY[7]};
}
.cron-builder-select {
min-width: 100px;
}
`;
const ItemDescriptionText = styled(Typography.Paragraph)``;
const DAILY_MIDNIGHT_CRON_INTERVAL = '0 0 * * *';
export const CreateScheduleStep = ({ state, updateState, goTo, prev }: StepProps) => {
const interval = state.schedule?.interval || '';
const interval = state.schedule?.interval?.replaceAll(', ', ' ') || DAILY_MIDNIGHT_CRON_INTERVAL;
const timezone = state.schedule?.timezone || Intl.DateTimeFormat().resolvedOptions().timeZone;
const setTimezone = (tz: string) => {
@ -110,9 +122,14 @@ export const CreateScheduleStep = ({ state, updateState, goTo, prev }: StepProps
<Typography.Text>Configure your ingestion source to run on a schedule.</Typography.Text>
</Section>
<Form layout="vertical">
<Form.Item required label={<Typography.Text strong>Schedule</Typography.Text>}>
<ItemDescriptionText>Provide a custom cron schedule.</ItemDescriptionText>
<Input value={interval} onChange={(e) => setCronInterval(e.target.value)} placeholder="* * * * *" />
<StyledFormItem required label={<Typography.Text strong>Schedule</Typography.Text>}>
<Cron
value={interval}
setValue={setCronInterval}
clearButton={false}
className="cron-builder"
leadingZero
/>
<CronText>
{cronAsText.error && <>Invalid cron schedule. Cron must be of UNIX form:</>}
{!cronAsText.text && (
@ -127,7 +144,7 @@ export const CreateScheduleStep = ({ state, updateState, goTo, prev }: StepProps
</>
)}
</CronText>
</Form.Item>
</StyledFormItem>
<Form.Item required label={<Typography.Text strong>Timezone</Typography.Text>}>
<ItemDescriptionText>Select the timezone to run the cron schedule in.</ItemDescriptionText>
<TimezoneSelect value={timezone} onChange={setTimezone} />

5
datahub-web-react/yarn.lock
View File

@ -13978,6 +13978,11 @@ react-is@^17.0.0, react-is@^17.0.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
react-js-cron@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/react-js-cron/-/react-js-cron-2.1.0.tgz#ce88a3260617222d8e1dc51534bb6606088304fc"
integrity sha512-mxpSS8WJAY6gRZ+XR8z22u4mRKfHmB4ej2BO3DKrNRZhTGdIdF19F45LZT6GKjQqVyWOYMK1mFafTvgqqoAXlQ==
react-markdown@6.0.2:
version "6.0.2"
resolved "https://registry.yarnpkg.com/react-markdown/-/react-markdown-6.0.2.tgz#d89be45c278b1e5f0196f851fffb11e30c69f027"