[Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection #120038

dominiqueclarke · 2021-11-30T22:46:53Z

Summary

Fixes elastic/uptime#413
Fixes elastic/uptime#412
Fixes elastic/uptime#416

dominiqueclarke · 2021-11-30T22:47:54Z

x-pack/plugins/uptime/common/runtime_types/monitor_management/index.ts

+export * from './state';
+
+export const MonitorManagementListResultType = t.type({
+  monitors: t.array(t.unknown),


Need runtime types for this.

dominiqueclarke · 2021-11-30T22:48:18Z

x-pack/plugins/uptime/public/components/monitor_management/monitor_list/monitor_list.tsx

+}: Props) => any = ({ monitorList: { list, error, loading }, pageSize, setPageSize }) => {
+  const items = list.monitors ?? [];
+
+  const columns = [


All of the types for the render functions should be replaced with types from the runtime monitor type

…able

…tor-management-table

shahzad31 · 2021-12-07T14:50:59Z

x-pack/plugins/uptime/public/components/monitor_management/add_monitor_btn.tsx

+          pathname: MONITOR_ADD_ROUTE,
+        })}
+      >
+        Add monitor


shahzad31 · 2021-12-07T14:51:29Z

x-pack/plugins/uptime/public/components/monitor_management/edit_monitor_config.tsx

+    monitorType,
+    tlsConfig: defaultTLSConfig,
+  } = useMemo(() => {
+    /* TODO: fetch current monitor to be edited from saved objects based on url param */


is this TODO still applicable?

shahzad31 · 2021-12-07T14:54:07Z

x-pack/plugins/uptime/public/components/monitor_management/monitor_config/locations.tsx

+      <EuiComboBox
+        placeholder={PLACEHOLDER_LABEL}
+        options={locations}
+        selectedOptions={selectedLocations}
+        inputRef={setLocationsInputRef}
+        onChange={onLocationChange}
+        onSearchChange={onSearchChange}
+        onBlur={onBlur}
+        data-test-subj="syntheticsServiceLocationsComboBox"
+      />


this should have a required or invalid state, since there should always be one location. Though i suspect combobox isn't the most ideal component, but let's move forward and iterate.

I think we will end up with something like checkbox for each location, and initially all of them selected and then user can uncheck some.

With a combobox, we certainly can have some initial state where all or the most common locations are selected, so I don't think it has to be checkboxes. Iterating sounds good.

shahzad31 · 2021-12-07T14:57:23Z

x-pack/plugins/uptime/public/pages/monitor_management.tsx

+  const monitorList = useSelector(monitorManagementListSelector);
+
+  useEffect(() => {
+    if (refresh) {


i think refresh will always be there?

After this effect runs, it sets refresh to false. I pass setRefresh to children, so when things like pagination or deleting monitors happenes, it calls setRefresh and sets it back to true

ok, i think i confused it with lastRefresh

shahzad31 · 2021-12-07T14:58:59Z

x-pack/plugins/uptime/public/state/reducers/monitor_management.ts

+  builder
+    .addCase(getMonitors, (state: WritableDraft<MonitorManagementList>) => ({
+      ...state,
+      loading: {
+        ...state.loading,
+        monitorList: true,
+      },
+    }))
+    .addCase(


Love it ❤️

If I'm being honest, it hasn't saved me very much time writing boilerplate yet, but maybe that's because everything else still isn't using redux toolkit.

shahzad31 · 2021-12-07T15:00:38Z

x-pack/plugins/uptime/server/rest_api/synthetics_service/get_service_locations.ts

@@ -14,5 +14,5 @@ export const getServiceLocationsRoute: UMRestApiRouteFactory = () => ({
  path: API_URLS.SERVICE_LOCATIONS,
  validate: {},
  handler: async ({ server }): Promise<any> =>
-    getServiceLocations({ manifestUrl: server.config.service.manifestUrl }),
+    getServiceLocations({ manifestUrl: server.config.unsafe.service.manifestUrl }),


told you this type isn't working. Something weird is going on, i will investigate.

elasticmachine · 2021-12-08T03:24:56Z

Pinging @elastic/uptime (Team:uptime)

shahzad31

LGTM, looks great, really excited about it !!

WFG, pending some tests failures !!

kibana-ci · 2021-12-08T16:57:20Z

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`uptime`	648	671	+23

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`uptime`	601.7KB	685.5KB	+83.9KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
`uptime`	23.2KB	23.3KB	+55.0B

History

💔 Build #12116 failed 8ca4162
💔 Build #12036 failed 7cb6e78
💔 Build #12035 failed abe0b3d
💔 Build #12015 failed 9bed87c
💔 Build #11978 failed 4abe36d

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

kibanamachine · 2021-12-08T17:06:25Z

💔 Backport failed

The backport operation could not be completed due to the following error:
There are no branches to backport to. Aborting.

The backport PRs will be merged automatically after passing CI.

To backport manually run:
node scripts/backport --pr 120038

…, and basic location selection (elastic#120038) * add basic ui monitor management table * Creating io-ts types for synthetics monitors. * add runtime types * adjust types in components * add monitor editing and deleting * add management link * add monitor btn * fix conflicts * fix conflicts * hide * add tags component * add locations * add pagination * adjust types * add unit tests * update tests * adjust types and i18n * fix types * eslint * update i18n * update i18n * update monitor types Co-authored-by: Abdul Zahid <[email protected]> Co-authored-by: shahzad31 <[email protected]>

add basic ui monitor management table

477bc2d

dominiqueclarke commented Nov 30, 2021

View reviewed changes

awahab07 and others added 19 commits December 1, 2021 15:18

Creating io-ts types for synthetics monitors.

345bdca

add runtime types

817ca34

adjust types in components

bae54f0

Merge github.com:awahab07/kibana into feature/ui-monitor-management-t…

57d9a31

…able

merge types branch

38920a4

add monitor editing and deleting

0c5fb14

add management link

d8398c0

add monitor btn

c07c535

Merge branch 'main' of github.com:elastic/kibana into feature/ui-moni…

0ea58b3

…tor-management-table

fix conflicts

15da066

fix conflicts

0b38f9a

hide

2bf2d1d

add tags component

97e214b

merge master

249004d

add locations

7ec8895

add pagination

aa046cc

adjust types

c2eb04c

merge master

17ac5c1

add unit tests

3f844f3

shahzad31 reviewed Dec 7, 2021

View reviewed changes

dominiqueclarke added 2 commits December 7, 2021 17:35

update tests

4abe36d

adjust types and i18n

9bed87c

dominiqueclarke changed the title ~~add basic ui monitor management table~~ [Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection Dec 8, 2021

dominiqueclarke marked this pull request as ready for review December 8, 2021 03:23

dominiqueclarke requested a review from a team as a code owner December 8, 2021 03:23

dominiqueclarke added Team:Uptime - DEPRECATED Synthetics & RUM sub-team of Application Observability v8.1.0 labels Dec 8, 2021

dominiqueclarke added release_note:skip Skip the PR/issue when compiling release notes auto-backport Deprecated - use backport:version if exact versions are needed enhancement New value added to drive a business result labels Dec 8, 2021

shahzad31 added 2 commits December 8, 2021 08:03

fix types

abe0b3d

eslint

7cb6e78

shahzad31 approved these changes Dec 8, 2021

View reviewed changes

dominiqueclarke added 4 commits December 8, 2021 08:30

update i18n

c6cafb3

merge master

8ca4162

update i18n

33573de

update monitor types

337c637

dominiqueclarke added the ci:deploy-cloud label Dec 8, 2021

dominiqueclarke merged commit e667c7f into elastic:main Dec 8, 2021

kibanamachine added the backport:skip This commit does not require backporting label Dec 8, 2021

dominiqueclarke deleted the feature/ui-monitor-management-table branch December 8, 2021 17:06

dominiqueclarke mentioned this pull request Dec 8, 2021

[Meta] Uptime public UI enhancements for Synthetics service elastic/uptime#407

Closed

26 tasks

tylersmalley added ci:cloud-deploy Create or update a Cloud deployment and removed ci:deploy-cloud labels Aug 17, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection #120038

[Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection #120038

dominiqueclarke commented Nov 30, 2021 •

edited

Loading

dominiqueclarke Nov 30, 2021

dominiqueclarke Nov 30, 2021

shahzad31 Dec 7, 2021

shahzad31 Dec 7, 2021

shahzad31 Dec 7, 2021

dominiqueclarke Dec 7, 2021

shahzad31 Dec 7, 2021

dominiqueclarke Dec 7, 2021

shahzad31 Dec 7, 2021

shahzad31 Dec 7, 2021

dominiqueclarke Dec 7, 2021

shahzad31 Dec 7, 2021

elasticmachine commented Dec 8, 2021

shahzad31 left a comment

kibana-ci commented Dec 8, 2021

kibanamachine commented Dec 8, 2021

[Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection #120038

[Uptime] Add basic ui monitor management table, basic monitor editing, and basic location selection #120038

Conversation

dominiqueclarke commented Nov 30, 2021 • edited Loading

Summary

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

elasticmachine commented Dec 8, 2021

shahzad31 left a comment

Choose a reason for hiding this comment

kibana-ci commented Dec 8, 2021

💚 Build Succeeded

Metrics [docs]

Module Count

Async chunks

Page load bundle

History

kibanamachine commented Dec 8, 2021

💔 Backport failed

dominiqueclarke commented Nov 30, 2021 •

edited

Loading