refactor: normalization checks (#16707)

* refactor(checks): action types

* feat: ive done too much

* fix: tsc errors

* fix: jest tests

* chore: change <resourceName>Status to activeStatus

* refactor: getResourceAtID

ui/src/alerting/actions/alertBuilder.ts

@@ -49,9 +49,9 @@ export const setAlertBuilderCheck = (check: Check) => ({
   payload: {check},
 })
 
-export const setAlertBuilderCheckStatus = (checkStatus: RemoteDataState) => ({
-  type: 'SET_ALERT_BUILER_CHECK_STATUS' as 'SET_ALERT_BUILER_CHECK_STATUS',
-  payload: {checkStatus},
+export const setAlertBuilderCheckStatus = (status: RemoteDataState) => ({
+  type: 'SET_ALERT_BUILDER_STATUS' as 'SET_ALERT_BUILDER_STATUS',
+  payload: {status},
 })
 
 export const changeCheckType = (toType: CheckType) => ({

ui/src/alerting/components/builder/MatchingRuleCard.tsx

@@ -7,7 +7,7 @@ import {ResourceCard} from '@influxdata/clockface'
 
 // Types
 import {
-  NotificationRule,
+  NotificationRuleDraft,
   AppState,
   NotificationEndpoint,
   ResourceType,
@@ -17,7 +17,7 @@ import {
 import {getAll} from 'src/resources/selectors'
 
 interface OwnProps {
-  rule: NotificationRule
+  rule: NotificationRuleDraft
 }
 
 interface StateProps {

ui/src/alerting/constants/index.ts

@@ -54,7 +54,7 @@ export const LEVEL_COMPONENT_COLORS = {
 export const DEFAULT_THRESHOLD_CHECK: Partial<ThresholdCheck> = {
   name: DEFAULT_CHECK_NAME,
   type: 'threshold',
-  status: 'active',
+  activeStatus: 'active',
   thresholds: [],
   every: DEFAULT_CHECK_EVERY,
   offset: DEFAULT_CHECK_OFFSET,
@@ -79,11 +79,11 @@ export const DEFAULT_ENDPOINT_URLS = {
 export const NEW_ENDPOINT_DRAFT: NotificationEndpoint = {
   name: 'Name this Endpoint',
   description: '',
-  status: 'active',
+  activeStatus: 'active',
   type: 'slack',
   token: '',
   url: DEFAULT_ENDPOINT_URLS['slack'],
-  loadingStatus: RemoteDataState.Done,
+  status: RemoteDataState.Done,
 }
 
 export const NEW_ENDPOINT_FIXTURES: NotificationEndpoint[] = [
@@ -93,22 +93,22 @@ export const NEW_ENDPOINT_FIXTURES: NotificationEndpoint[] = [
     userID: '1',
     description: 'interrupt everyone at work',
     name: 'Slack',
-    status: 'active',
+    activeStatus: 'active',
     type: 'slack',
     url: 'insert.slack.url.here',
     token: 'plerps',
-    loadingStatus: RemoteDataState.Done,
+    status: RemoteDataState.Done,
   },
   {
     id: '3',
     orgID: '1',
     userID: '1',
     description: 'interrupt someone by all means known to man',
     name: 'PagerDuty',
-    status: 'active',
+    activeStatus: 'active',
     type: 'pagerduty',
     clientURL: 'insert.pagerduty.client.url.here',
     routingKey: 'plerps',
-    loadingStatus: RemoteDataState.Done,
+    status: RemoteDataState.Done,
   },
 ]

ui/src/alerting/reducers/alertBuilder.test.ts

@@ -19,12 +19,24 @@ import {
   updateThresholds,
 } from 'src/alerting/actions/alertBuilder'
 import {CHECK_FIXTURE_1, CHECK_FIXTURE_3} from 'src/checks/reducers/checks.test'
-import {RemoteDataState, Threshold} from 'src/types'
+import {RemoteDataState, Threshold, TaskStatusType} from 'src/types'
+
+const check_1 = {
+  ...CHECK_FIXTURE_1,
+  activeStatus: 'inactive' as TaskStatusType,
+  status: RemoteDataState.Done,
+}
+
+const check_3 = {
+  ...CHECK_FIXTURE_3,
+  activeStatus: 'active' as TaskStatusType,
+  status: RemoteDataState.Done,
+}
 
 const mockState = (): AlertBuilderState => ({
   id: '3',
   type: 'deadman',
-  status: 'active',
+  activeStatus: 'active',
   name: 'just',
   every: '1m',
   offset: '2m',
@@ -35,7 +47,7 @@ const mockState = (): AlertBuilderState => ({
   staleTime: '2m',
   level: 'OK',
   thresholds: [],
-  checkStatus: RemoteDataState.Done,
+  status: RemoteDataState.Done,
 })
 
 describe('alertBuilderReducer', () => {
@@ -52,10 +64,10 @@ describe('alertBuilderReducer', () => {
     it('Loads threshold check properties in to alert builder', () => {
       const actual = alertBuilderReducer(
         initialState(),
-        setAlertBuilderCheck(CHECK_FIXTURE_1)
+        setAlertBuilderCheck(check_1)
       )
 
-      const expected = CHECK_FIXTURE_1
+      const expected = check_1
 
       expect(actual.type).toEqual(expected.type)
       expect(actual.name).toEqual(expected.name)
@@ -66,16 +78,16 @@ describe('alertBuilderReducer', () => {
       )
       expect(actual.tags).toEqual(expected.tags)
       expect(actual.thresholds).toEqual(expected.thresholds)
-      expect(actual.checkStatus).toEqual(RemoteDataState.Done)
+      expect(actual.status).toEqual(RemoteDataState.Done)
     })
 
     it('Loads deadman check properties in to alert builder', () => {
       const actual = alertBuilderReducer(
         initialState(),
-        setAlertBuilderCheck(CHECK_FIXTURE_3)
+        setAlertBuilderCheck(check_3)
       )
 
-      const expected = CHECK_FIXTURE_3
+      const expected = check_3
 
       expect(actual.type).toEqual(expected.type)
       expect(actual.name).toEqual(expected.name)
@@ -90,21 +102,21 @@ describe('alertBuilderReducer', () => {
       expect(actual.staleTime).toEqual(expected.staleTime)
       expect(actual.reportZero).toEqual(expected.reportZero)
       expect(actual.level).toEqual(expected.level)
-      expect(actual.checkStatus).toEqual(RemoteDataState.Done)
+      expect(actual.status).toEqual(RemoteDataState.Done)
     })
   })
 
   describe('setAlertBuilderCheckStatus', () => {
     it('check status is initialized to Not Started', () => {
-      expect(initialState().checkStatus).toEqual(RemoteDataState.NotStarted)
+      expect(initialState().status).toEqual(RemoteDataState.NotStarted)
     })
     it('sets check status', () => {
       const newStatus = RemoteDataState.Error
       const actual = alertBuilderReducer(
         initialState(),
         setAlertBuilderCheckStatus(newStatus)
       )
-      expect(actual.checkStatus).toEqual(newStatus)
+      expect(actual.status).toEqual(newStatus)
     })
   })
 

ui/src/alerting/reducers/alertBuilder.ts

@@ -16,7 +16,9 @@ import {
   DEFAULT_CHECK_TAGS,
 } from 'src/alerting/constants'
 
-type FromBase = Required<Pick<CheckBase, 'name' | 'id' | 'status'>>
+type FromBase = Required<
+  Pick<CheckBase, 'name' | 'id' | 'activeStatus' | 'status'>
+>
 
 type FromThreshold = Required<
   Pick<
@@ -34,12 +36,12 @@ export interface AlertBuilderState
     FromThreshold,
     FromDeadman {
   type: CheckType
-  checkStatus: RemoteDataState
 }
 
 export const initialState = (): AlertBuilderState => ({
   id: null,
-  status: 'active',
+  activeStatus: 'active',
+  status: RemoteDataState.NotStarted,
   type: 'threshold',
   name: DEFAULT_CHECK_NAME,
   every: DEFAULT_CHECK_EVERY,
@@ -51,7 +53,6 @@ export const initialState = (): AlertBuilderState => ({
   staleTime: '10m',
   level: DEFAULT_DEADMAN_LEVEL,
   thresholds: [],
-  checkStatus: RemoteDataState.NotStarted,
 })
 
 export default (
@@ -67,7 +68,7 @@ export default (
       return {
         ...initialState(),
         type: action.payload.type,
-        checkStatus: RemoteDataState.Done,
+        status: RemoteDataState.Done,
       }
     }
 
@@ -80,7 +81,7 @@ export default (
 
       const newState = {
         ...initialState(),
-        checkStatus: RemoteDataState.Done,
+        status: RemoteDataState.Done,
         id,
         name,
         query,
@@ -90,6 +91,7 @@ export default (
       if (action.payload.check.type === 'custom') {
         return newState
       }
+
       if (action.payload.check.type === 'threshold') {
         const {
           every,
@@ -137,8 +139,8 @@ export default (
       )
     }
 
-    case 'SET_ALERT_BUILER_CHECK_STATUS': {
-      return {...state, checkStatus: action.payload.checkStatus}
+    case 'SET_ALERT_BUILDER_STATUS': {
+      return {...state, status: action.payload.status}
     }
 
     case 'SET_ALERT_BUILDER_EVERY': {

ui/src/alerting/utils/customCheck.test.ts

@@ -9,8 +9,8 @@ const bc1: BuilderConfig = {
 }
 
 const ab1: AlertBuilderState = {
-  status: 'active',
-  checkStatus: RemoteDataState.Done,
+  activeStatus: 'active',
+  status: RemoteDataState.Done,
   statusMessageTemplate: 'this is staus message',
   tags: [{key: 'k1', value: 'v1'}],
   id: '2',
@@ -30,8 +30,8 @@ const ab1: AlertBuilderState = {
 }
 
 const ab2: AlertBuilderState = {
-  status: 'active',
-  checkStatus: RemoteDataState.Done,
+  activeStatus: 'active',
+  status: RemoteDataState.Done,
   statusMessageTemplate: 'this is staus message',
   tags: [{key: 'k1', value: 'v1'}],
   id: '2',

ui/src/checks/actions/creators.ts

@@ -0,0 +1,63 @@
+// Types
+import {RemoteDataState, Label, CheckEntities} from 'src/types'
+import {NormalizedSchema} from 'normalizr'
+
+export type Action =
+  | ReturnType<typeof setChecks>
+  | ReturnType<typeof setCheck>
+  | ReturnType<typeof removeCheck>
+  | ReturnType<typeof addLabelToCheck>
+  | ReturnType<typeof removeLabelFromCheck>
+
+export const SET_CHECKS = 'SET_CHECKS'
+export const SET_CHECK = 'SET_CHECK'
+export const REMOVE_CHECK = 'REMOVE_CHECK'
+export const ADD_LABEL_TO_CHECK = 'ADD_LABEL_TO_CHECK'
+export const REMOVE_LABEL_FROM_CHECK = 'REMOVE_LABEL_FROM_CHECK'
+
+type ChecksSchema<R extends string | string[]> = NormalizedSchema<
+  CheckEntities,
+  R
+>
+
+export const setChecks = (
+  status: RemoteDataState,
+  schema?: ChecksSchema<string[]>
+) =>
+  ({
+    type: SET_CHECKS,
+    status,
+    schema,
+  } as const)
+
+export const setCheck = (
+  id: string,
+  status: RemoteDataState,
+  schema?: ChecksSchema<string>
+) =>
+  ({
+    type: SET_CHECK,
+    id,
+    status,
+    schema,
+  } as const)
+
+export const removeCheck = (id: string) =>
+  ({
+    type: REMOVE_CHECK,
+    id,
+  } as const)
+
+export const addLabelToCheck = (checkID: string, label: Label) =>
+  ({
+    type: ADD_LABEL_TO_CHECK,
+    checkID,
+    label,
+  } as const)
+
+export const removeLabelFromCheck = (checkID: string, labelID: string) =>
+  ({
+    type: REMOVE_LABEL_FROM_CHECK,
+    checkID,
+    labelID,
+  } as const)