refactor(TopShards): migrate reducer to ts

Author: ariser

src/containers/Tenant/Diagnostics/TopShards/TopShards.tsx

@@ -61,13 +61,12 @@ function stringToDataTableSortOrder(value: string): SortOrder[] | undefined {
 }
 
 function stringToQuerySortOrder(value: string) {
-    return (
-        value &&
-        value.split(',').map((columnId) => ({
-            columnId,
-            order: 'DESC',
-        }))
-    );
+    return value
+        ? value.split(',').map((columnId) => ({
+              columnId,
+              order: 'DESC',
+          }))
+        : undefined;
 }
 
 function dataTableToStringSortOrder(value: SortOrder | SortOrder[] = []) {

src/store/reducers/shardsWorkload.js renamed to src/store/reducers/shardsWorkload.ts

@@ -1,29 +1,35 @@
+import type {Reducer} from 'redux';
+
 import '../../services/api';
+import type {IShardsWorkloadAction, IShardsWorkloadState} from '../../types/store/shardsWorkload';
 
 import {parseQueryAPIExecuteResponse} from '../../utils/query';
 
 import {createRequestActionTypes, createApiRequest} from '../utils';
 
-const SEND_SHARD_QUERY = createRequestActionTypes('query', 'SEND_SHARD_QUERY');
+export const SEND_SHARD_QUERY = createRequestActionTypes('query', 'SEND_SHARD_QUERY');
 const SET_SHARD_QUERY_OPTIONS = 'query/SET_SHARD_QUERY_OPTIONS';
 
 const initialState = {
     loading: false,
     wasLoaded: false,
 };
 
-function formatSortOrder({columnId, order}) {
+export interface SortOrder {
+    columnId: string;
+    order: string;
+}
+
+function formatSortOrder({columnId, order}: SortOrder) {
     return `${columnId} ${order}`;
 }
 
-function createShardQuery(path, sortOrder, tenantName) {
-    const orderBy = Array.isArray(sortOrder) ?
-        `ORDER BY ${sortOrder.map(formatSortOrder).join(', ')}` :
-        '';
+function createShardQuery(path: string, sortOrder?: SortOrder[], tenantName?: string) {
+    const orderBy = sortOrder ? `ORDER BY ${sortOrder.map(formatSortOrder).join(', ')}` : '';
 
-    const pathSelect = tenantName ?
-        `CAST(SUBSTRING(CAST(Path AS String), ${tenantName.length}) AS Utf8) AS Path` :
-        'Path';
+    const pathSelect = tenantName
+        ? `CAST(SUBSTRING(CAST(Path AS String), ${tenantName.length}) AS Utf8) AS Path`
+        : 'Path';
 
     return `SELECT
     ${pathSelect},
@@ -40,7 +46,10 @@ LIMIT 20`;
 
 const queryAction = 'execute-scan';
 
-const shardsWorkload = (state = initialState, action) => {
+const shardsWorkload: Reducer<IShardsWorkloadState, IShardsWorkloadAction> = (
+    state = initialState,
+    action,
+) => {
     switch (action.type) {
         case SEND_SHARD_QUERY.REQUEST: {
             return {
@@ -76,7 +85,13 @@ const shardsWorkload = (state = initialState, action) => {
     }
 };
 
-export const sendShardQuery = ({database, path = '', sortOrder}) => {
+interface SendShardQueryParams {
+    database?: string;
+    path?: string;
+    sortOrder?: SortOrder[];
+}
+
+export const sendShardQuery = ({database, path = '', sortOrder}: SendShardQueryParams) => {
     return createApiRequest({
         request: window.api.sendQuery({
             schema: 'modern',
@@ -91,11 +106,11 @@ export const sendShardQuery = ({database, path = '', sortOrder}) => {
     });
 };
 
-export function setShardQueryOptions(options) {
+export function setShardQueryOptions(options: Partial<IShardsWorkloadState>) {
     return {
         type: SET_SHARD_QUERY_OPTIONS,
         data: options,
-    };
+    } as const;
 }
 
 export default shardsWorkload;

src/types/store/shardsWorkload.ts

@@ -0,0 +1,19 @@
+import {SEND_SHARD_QUERY, setShardQueryOptions} from '../../store/reducers/shardsWorkload';
+import type {ApiRequestAction} from '../../store/utils';
+import type {IResponseError} from '../api/error';
+import type {IQueryResult} from './query';
+
+export interface IShardsWorkloadState {
+    loading: boolean;
+    wasLoaded: boolean;
+    data?: IQueryResult;
+    error?: IResponseError;
+}
+
+export type IShardsWorkloadAction =
+    | ApiRequestAction<typeof SEND_SHARD_QUERY, IQueryResult, IResponseError>
+    | ReturnType<typeof setShardQueryOptions>;
+
+export interface IShardsWorkloadRootStateSlice {
+    shardsWorkload: IShardsWorkloadState;
+}