Skip to content
This repository has been archived by the owner on Aug 9, 2022. It is now read-only.

Migrate create_report/ to Typescript #17

Conversation

davidcui1225
Copy link
Contributor

Issue #, if available:
#7
Description of changes:
Migrate all files in create_report/ to Typescript. All UI will be migrated to Typescript after this PR and #14 are merged.

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

@davidcui1225 davidcui1225 requested a review from mihirsoni June 19, 2020 19:31
Copy link
Member

@zhongnansu zhongnansu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Copy link

@mihirsoni mihirsoni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the changes. Some minor comments and I think otherwise looks good.

Comment on lines 40 to 51
const [reportSettingsDashboard, setReportSettingsDashboard] = useState('');
const [deliveryEmailSubject, setDeliveryEmailSubject] = useState('');
const [deliveryEmailBody, setDeliveryEmailBody] = useState('');
const [scheduleRadioFutureDateSelected, setScheduleRadioFutureDateSelected] = useState(false);
const [scheduleRadioRecurringSelected, setScheduleRadioRecurringSelected] = useState(false);
const [scheduleUTCOffset, setScheduleUTCOffset] = useState(0);
const [scheduleFutureDate, setScheduleFutureDate] = useState(moment());
const [scheduleRecurringFrequency, setScheduleRecurringFrequency] = useState('Daily');
const [scheduleRecurringUTCOffset, setScheduleRecurringUTCOffset] = useState(0);
const [scheduleRecurringWeeklyDayOfWeek, setScheduleRecurringWeeklyDayOfWeek] = useState('Monday');
const [scheduleRecurringStartDate, setScheduleRecurringStartDate] = useState(moment());
const [scheduleRadioIdSelected, setScheduleRadioIdSelected] = useState(`${idPrefix}7`);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Use can also use useState with object. Such as

const reportState = useState<CreateReportState>({
....otherstates.
})

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would I be defining the other states in CreateReportState? Otherwise I don't think I fully understand the added benefit

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Correct you can create a State which contains all the required info and move this inside une useState. to simplify

public/components/create_report/create_report.tsx Outdated Show resolved Hide resolved
public/components/create_report/create_report.tsx Outdated Show resolved Hide resolved
public/components/create_report/create_report.tsx Outdated Show resolved Hide resolved
{ value: -10, text: 'HST -10:00' }
];

const ScheduleFutureDatePicker = () => {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You could move all individual components out to simplify and better readability.

@davidcui1225 davidcui1225 requested a review from mihirsoni July 2, 2020 00:31
Copy link

@mihirsoni mihirsoni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just put TODO to simplified useState.

@davidcui1225 davidcui1225 merged commit d5b2bfd into opendistro-for-elasticsearch:dev Jul 8, 2020
@davidcui1225 davidcui1225 deleted the migrate-typescript-create_report branch July 29, 2020 17:37
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants