From 83ce3f7f5ba6519575f024c14d02522dad3f23b9 Mon Sep 17 00:00:00 2001 From: Oleg Shuralev Date: Tue, 4 Feb 2020 09:23:53 +0300 Subject: [PATCH] Update the file structure --- src/components/AppContainer.tsx | 4 +- src/components/Brokers/Brokers.tsx | 2 +- src/components/Brokers/BrokersContainer.ts | 4 +- .../ClustersWidget/ClusterWidget.tsx | 2 +- .../ClustersWidget/ClustersWidget.tsx | 2 +- .../ClustersWidget/ClustersWidgetContainer.ts | 2 +- src/components/Nav/ClusterMenu.tsx | 2 +- src/components/Nav/Nav.tsx | 2 +- src/components/Nav/NavConatiner.ts | 2 +- src/components/Topics/Details/Details.tsx | 2 +- .../Topics/Details/DetailsContainer.ts | 2 +- .../Topics/Details/Messages/Messages.tsx | 2 +- .../Details/Messages/MessagesContainer.ts | 2 +- .../Topics/Details/Overview/Overview.tsx | 2 +- .../Details/Overview/OverviewContainer.ts | 4 +- .../Topics/Details/Settings/Settings.tsx | 2 +- .../Details/Settings/SettingsContainer.ts | 4 +- src/components/Topics/List/List.tsx | 2 +- src/components/Topics/List/ListContainer.ts | 2 +- src/components/Topics/List/ListItem.tsx | 2 +- src/components/Topics/New/New.tsx | 2 +- src/components/Topics/New/NewContainer.ts | 4 +- src/components/Topics/Topics.tsx | 2 +- src/components/Topics/TopicsContainer.ts | 4 +- src/lib/constants.ts | 2 + src/lib/paths.ts | 5 +- src/redux/{reducers/topics => }/actionType.ts | 18 ++++- .../{reducers/topics => actions}/actions.ts | 30 ++++++- src/redux/actions/index.ts | 2 + src/redux/actions/thunks.ts | 79 +++++++++++++++++++ src/{lib => redux}/api/brokers.ts | 2 +- src/{lib => redux}/api/clusters.ts | 2 +- src/{lib => redux}/api/index.ts | 0 src/{lib => redux}/api/topics.ts | 2 +- src/{lib => redux}/interfaces/broker.ts | 0 src/{lib => redux}/interfaces/cluster.ts | 0 src/{lib => redux}/interfaces/index.ts | 6 +- src/{lib => redux}/interfaces/loader.ts | 2 +- src/{lib => redux}/interfaces/topic.ts | 0 src/redux/reducers/actionType.ts | 9 --- src/redux/reducers/brokers/actionType.ts | 11 --- src/redux/reducers/brokers/actions.ts | 15 ---- src/redux/reducers/brokers/reducer.ts | 17 ++-- src/redux/reducers/brokers/selectors.ts | 4 +- src/redux/reducers/brokers/thunks.ts | 27 ------- src/redux/reducers/clusters/actionType.ts | 7 -- src/redux/reducers/clusters/actions.ts | 9 --- src/redux/reducers/clusters/reducer.ts | 6 +- src/redux/reducers/clusters/selectors.ts | 2 +- src/redux/reducers/clusters/thunks.ts | 19 ----- src/redux/reducers/index.ts | 2 +- src/redux/reducers/loader/reducer.ts | 8 +- src/redux/reducers/loader/selectors.ts | 2 +- src/redux/reducers/topics/reducer.ts | 10 +-- src/redux/reducers/topics/selectors.ts | 9 +-- src/redux/reducers/topics/thunks.ts | 54 ------------- 56 files changed, 199 insertions(+), 222 deletions(-) rename src/redux/{reducers/topics => }/actionType.ts (55%) rename src/redux/{reducers/topics => actions}/actions.ts (54%) create mode 100644 src/redux/actions/index.ts create mode 100644 src/redux/actions/thunks.ts rename src/{lib => redux}/api/brokers.ts (94%) rename src/{lib => redux}/api/clusters.ts (88%) rename src/{lib => redux}/api/index.ts (100%) rename src/{lib => redux}/api/topics.ts (98%) rename src/{lib => redux}/interfaces/broker.ts (100%) rename src/{lib => redux}/interfaces/cluster.ts (100%) rename src/{lib => redux}/interfaces/index.ts (71%) rename src/{lib => redux}/interfaces/loader.ts (57%) rename src/{lib => redux}/interfaces/topic.ts (100%) delete mode 100644 src/redux/reducers/actionType.ts delete mode 100644 src/redux/reducers/brokers/actionType.ts delete mode 100644 src/redux/reducers/brokers/actions.ts delete mode 100644 src/redux/reducers/brokers/thunks.ts delete mode 100644 src/redux/reducers/clusters/actionType.ts delete mode 100644 src/redux/reducers/clusters/actions.ts delete mode 100644 src/redux/reducers/clusters/thunks.ts delete mode 100644 src/redux/reducers/topics/thunks.ts diff --git a/src/components/AppContainer.tsx b/src/components/AppContainer.tsx index 0687f08320..1206fceee1 100644 --- a/src/components/AppContainer.tsx +++ b/src/components/AppContainer.tsx @@ -1,10 +1,10 @@ import { connect } from 'react-redux'; import { fetchClustersList, -} from 'redux/reducers/clusters/thunks'; +} from 'redux/actions'; import App from './App'; import { getIsClusterListFetched } from 'redux/reducers/clusters/selectors'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; const mapStateToProps = (state: RootState) => ({ isClusterListFetched: getIsClusterListFetched(state), diff --git a/src/components/Brokers/Brokers.tsx b/src/components/Brokers/Brokers.tsx index bec64cc090..ddad0b610e 100644 --- a/src/components/Brokers/Brokers.tsx +++ b/src/components/Brokers/Brokers.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, BrokerMetrics, ZooKeeperStatus } from 'lib/interfaces'; +import { ClusterId, BrokerMetrics, ZooKeeperStatus } from 'redux/interfaces'; import useInterval from 'lib/hooks/useInterval'; import formatBytes from 'lib/utils/formatBytes'; import cx from 'classnames'; diff --git a/src/components/Brokers/BrokersContainer.ts b/src/components/Brokers/BrokersContainer.ts index 88ee382893..ec374ca0d3 100644 --- a/src/components/Brokers/BrokersContainer.ts +++ b/src/components/Brokers/BrokersContainer.ts @@ -2,10 +2,10 @@ import { connect } from 'react-redux'; import { fetchBrokers, fetchBrokerMetrics, -} from 'redux/reducers/brokers/thunks'; +} from 'redux/actions'; import Brokers from './Brokers'; import * as brokerSelectors from 'redux/reducers/brokers/selectors'; -import { RootState, ClusterId } from 'lib/interfaces'; +import { RootState, ClusterId } from 'redux/interfaces'; import { RouteComponentProps } from 'react-router-dom'; interface RouteProps { diff --git a/src/components/Dashboard/ClustersWidget/ClusterWidget.tsx b/src/components/Dashboard/ClustersWidget/ClusterWidget.tsx index 1e0847daeb..bc7e8d7851 100644 --- a/src/components/Dashboard/ClustersWidget/ClusterWidget.tsx +++ b/src/components/Dashboard/ClustersWidget/ClusterWidget.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Cluster, ClusterStatus } from 'lib/interfaces'; +import { Cluster, ClusterStatus } from 'redux/interfaces'; import formatBytes from 'lib/utils/formatBytes'; import { NavLink } from 'react-router-dom'; import { clusterBrokersPath } from 'lib/paths'; diff --git a/src/components/Dashboard/ClustersWidget/ClustersWidget.tsx b/src/components/Dashboard/ClustersWidget/ClustersWidget.tsx index 0195ed92b5..c4f0a5750e 100644 --- a/src/components/Dashboard/ClustersWidget/ClustersWidget.tsx +++ b/src/components/Dashboard/ClustersWidget/ClustersWidget.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { chunk } from 'lodash'; -import { Cluster } from 'lib/interfaces'; +import { Cluster } from 'redux/interfaces'; import MetricsWrapper from 'components/common/Dashboard/MetricsWrapper'; import Indicator from 'components/common/Dashboard/Indicator'; import ClusterWidget from './ClusterWidget'; diff --git a/src/components/Dashboard/ClustersWidget/ClustersWidgetContainer.ts b/src/components/Dashboard/ClustersWidget/ClustersWidgetContainer.ts index 7111ce4fc7..0d5db55eec 100644 --- a/src/components/Dashboard/ClustersWidget/ClustersWidgetContainer.ts +++ b/src/components/Dashboard/ClustersWidget/ClustersWidgetContainer.ts @@ -5,7 +5,7 @@ import { getOnlineClusters, getOfflineClusters, } from 'redux/reducers/clusters/selectors'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; const mapStateToProps = (state: RootState) => ({ clusters: getClusterList(state), diff --git a/src/components/Nav/ClusterMenu.tsx b/src/components/Nav/ClusterMenu.tsx index 880ceaa7f6..a56615046d 100644 --- a/src/components/Nav/ClusterMenu.tsx +++ b/src/components/Nav/ClusterMenu.tsx @@ -1,5 +1,5 @@ import React, { CSSProperties } from 'react'; -import { Cluster } from 'lib/interfaces'; +import { Cluster } from 'redux/interfaces'; import { NavLink } from 'react-router-dom'; import { clusterBrokersPath, clusterTopicsPath } from 'lib/paths'; diff --git a/src/components/Nav/Nav.tsx b/src/components/Nav/Nav.tsx index 1d1a2ad6b3..acd427bc6f 100644 --- a/src/components/Nav/Nav.tsx +++ b/src/components/Nav/Nav.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Cluster } from 'lib/interfaces'; +import { Cluster } from 'redux/interfaces'; import { NavLink } from 'react-router-dom'; import cx from 'classnames'; import ClusterMenu from './ClusterMenu'; diff --git a/src/components/Nav/NavConatiner.ts b/src/components/Nav/NavConatiner.ts index 2ab2a365c3..6cb710ee9f 100644 --- a/src/components/Nav/NavConatiner.ts +++ b/src/components/Nav/NavConatiner.ts @@ -1,7 +1,7 @@ import { connect } from 'react-redux'; import Nav from './Nav'; import { getIsClusterListFetched, getClusterList } from 'redux/reducers/clusters/selectors'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; const mapStateToProps = (state: RootState) => ({ isClusterListFetched: getIsClusterListFetched(state), diff --git a/src/components/Topics/Details/Details.tsx b/src/components/Topics/Details/Details.tsx index 1907477d00..9069fb4975 100644 --- a/src/components/Topics/Details/Details.tsx +++ b/src/components/Topics/Details/Details.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, Topic, TopicDetails, TopicName } from 'lib/interfaces'; +import { ClusterId, Topic, TopicDetails, TopicName } from 'redux/interfaces'; import Breadcrumb from 'components/common/Breadcrumb/Breadcrumb'; import { NavLink, Switch, Route } from 'react-router-dom'; import { clusterTopicsPath, clusterTopicSettingsPath, clusterTopicPath, clusterTopicMessagesPath } from 'lib/paths'; diff --git a/src/components/Topics/Details/DetailsContainer.ts b/src/components/Topics/Details/DetailsContainer.ts index 3a706ec055..177ed134dc 100644 --- a/src/components/Topics/Details/DetailsContainer.ts +++ b/src/components/Topics/Details/DetailsContainer.ts @@ -1,6 +1,6 @@ import { connect } from 'react-redux'; import Details from './Details'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; import { withRouter, RouteComponentProps } from 'react-router-dom'; interface RouteProps { diff --git a/src/components/Topics/Details/Messages/Messages.tsx b/src/components/Topics/Details/Messages/Messages.tsx index e9715491db..a6264e8fb4 100644 --- a/src/components/Topics/Details/Messages/Messages.tsx +++ b/src/components/Topics/Details/Messages/Messages.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, TopicName } from 'lib/interfaces'; +import { ClusterId, TopicName } from 'redux/interfaces'; interface Props { clusterId: ClusterId; diff --git a/src/components/Topics/Details/Messages/MessagesContainer.ts b/src/components/Topics/Details/Messages/MessagesContainer.ts index a2f0c3aad7..8e3e0a81c0 100644 --- a/src/components/Topics/Details/Messages/MessagesContainer.ts +++ b/src/components/Topics/Details/Messages/MessagesContainer.ts @@ -1,6 +1,6 @@ import { connect } from 'react-redux'; import Messages from './Messages'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; import { withRouter, RouteComponentProps } from 'react-router-dom'; interface RouteProps { diff --git a/src/components/Topics/Details/Overview/Overview.tsx b/src/components/Topics/Details/Overview/Overview.tsx index a1eed58cf6..c47952867b 100644 --- a/src/components/Topics/Details/Overview/Overview.tsx +++ b/src/components/Topics/Details/Overview/Overview.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, Topic, TopicDetails, TopicName } from 'lib/interfaces'; +import { ClusterId, Topic, TopicDetails, TopicName } from 'redux/interfaces'; import MetricsWrapper from 'components/common/Dashboard/MetricsWrapper'; import Indicator from 'components/common/Dashboard/Indicator'; diff --git a/src/components/Topics/Details/Overview/OverviewContainer.ts b/src/components/Topics/Details/Overview/OverviewContainer.ts index 2302f244b5..d1912baea4 100644 --- a/src/components/Topics/Details/Overview/OverviewContainer.ts +++ b/src/components/Topics/Details/Overview/OverviewContainer.ts @@ -1,9 +1,9 @@ import { connect } from 'react-redux'; import { fetchTopicDetails, -} from 'redux/reducers/topics/thunks'; +} from 'redux/actions'; import Overview from './Overview'; -import { RootState, TopicName, ClusterId } from 'lib/interfaces'; +import { RootState, TopicName, ClusterId } from 'redux/interfaces'; import { getTopicByName, getIsTopicDetailsFetched } from 'redux/reducers/topics/selectors'; import { withRouter, RouteComponentProps } from 'react-router-dom'; diff --git a/src/components/Topics/Details/Settings/Settings.tsx b/src/components/Topics/Details/Settings/Settings.tsx index d07203cffd..4312649fbf 100644 --- a/src/components/Topics/Details/Settings/Settings.tsx +++ b/src/components/Topics/Details/Settings/Settings.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, TopicName, TopicConfig } from 'lib/interfaces'; +import { ClusterId, TopicName, TopicConfig } from 'redux/interfaces'; interface Props { clusterId: ClusterId; diff --git a/src/components/Topics/Details/Settings/SettingsContainer.ts b/src/components/Topics/Details/Settings/SettingsContainer.ts index e10c0cd293..d3108efb39 100644 --- a/src/components/Topics/Details/Settings/SettingsContainer.ts +++ b/src/components/Topics/Details/Settings/SettingsContainer.ts @@ -1,9 +1,9 @@ import { connect } from 'react-redux'; -import { RootState, ClusterId, TopicName } from 'lib/interfaces'; +import { RootState, ClusterId, TopicName } from 'redux/interfaces'; import { withRouter, RouteComponentProps } from 'react-router-dom'; import { fetchTopicConfig, -} from 'redux/reducers/topics/thunks'; +} from 'redux/actions'; import Settings from './Settings'; import { getTopicConfig, diff --git a/src/components/Topics/List/List.tsx b/src/components/Topics/List/List.tsx index 41b8798954..e058dbb102 100644 --- a/src/components/Topics/List/List.tsx +++ b/src/components/Topics/List/List.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { TopicWithDetailedInfo, ClusterId } from 'lib/interfaces'; +import { TopicWithDetailedInfo, ClusterId } from 'redux/interfaces'; import ListItem from './ListItem'; import Breadcrumb from 'components/common/Breadcrumb/Breadcrumb'; import { NavLink } from 'react-router-dom'; diff --git a/src/components/Topics/List/ListContainer.ts b/src/components/Topics/List/ListContainer.ts index 15a348a1d9..1c6450c510 100644 --- a/src/components/Topics/List/ListContainer.ts +++ b/src/components/Topics/List/ListContainer.ts @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; import { getTopicList, getExternalTopicList } from 'redux/reducers/topics/selectors'; import List from './List'; import { withRouter, RouteComponentProps } from 'react-router-dom'; diff --git a/src/components/Topics/List/ListItem.tsx b/src/components/Topics/List/ListItem.tsx index de0bf42bde..a9197877f1 100644 --- a/src/components/Topics/List/ListItem.tsx +++ b/src/components/Topics/List/ListItem.tsx @@ -1,7 +1,7 @@ import React from 'react'; import cx from 'classnames'; import { NavLink } from 'react-router-dom'; -import { TopicWithDetailedInfo } from 'lib/interfaces'; +import { TopicWithDetailedInfo } from 'redux/interfaces'; const ListItem: React.FC = ({ name, diff --git a/src/components/Topics/New/New.tsx b/src/components/Topics/New/New.tsx index 63d581302e..0b4a1d5f0f 100644 --- a/src/components/Topics/New/New.tsx +++ b/src/components/Topics/New/New.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId, CleanupPolicy, TopicFormData, TopicName } from 'lib/interfaces'; +import { ClusterId, CleanupPolicy, TopicFormData, TopicName } from 'redux/interfaces'; import Breadcrumb from 'components/common/Breadcrumb/Breadcrumb'; import { clusterTopicsPath } from 'lib/paths'; import { useForm, ErrorMessage } from 'react-hook-form'; diff --git a/src/components/Topics/New/NewContainer.ts b/src/components/Topics/New/NewContainer.ts index 9a006909ac..7049d814d1 100644 --- a/src/components/Topics/New/NewContainer.ts +++ b/src/components/Topics/New/NewContainer.ts @@ -1,8 +1,8 @@ import { connect } from 'react-redux'; -import { RootState, ClusterId, TopicFormData, TopicName, Action } from 'lib/interfaces'; +import { RootState, ClusterId, TopicFormData, TopicName, Action } from 'redux/interfaces'; import New from './New'; import { withRouter, RouteComponentProps } from 'react-router-dom'; -import { createTopic } from 'redux/reducers/topics/thunks'; +import { createTopic } from 'redux/actions'; import { getTopicCreated } from 'redux/reducers/topics/selectors'; import { clusterTopicPath } from 'lib/paths'; import { ThunkDispatch } from 'redux-thunk'; diff --git a/src/components/Topics/Topics.tsx b/src/components/Topics/Topics.tsx index d1074575cf..3c1131fcf8 100644 --- a/src/components/Topics/Topics.tsx +++ b/src/components/Topics/Topics.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ClusterId } from 'lib/interfaces'; +import { ClusterId } from 'redux/interfaces'; import { Switch, Route, diff --git a/src/components/Topics/TopicsContainer.ts b/src/components/Topics/TopicsContainer.ts index 4928366f8d..ef09cbd188 100644 --- a/src/components/Topics/TopicsContainer.ts +++ b/src/components/Topics/TopicsContainer.ts @@ -1,8 +1,8 @@ import { connect } from 'react-redux'; -import { fetchTopicList } from 'redux/reducers/topics/thunks'; +import { fetchTopicList } from 'redux/actions'; import Topics from './Topics'; import { getIsTopicListFetched } from 'redux/reducers/topics/selectors'; -import { RootState, ClusterId } from 'lib/interfaces'; +import { RootState, ClusterId } from 'redux/interfaces'; import { RouteComponentProps } from 'react-router-dom'; interface RouteProps { diff --git a/src/lib/constants.ts b/src/lib/constants.ts index 8cc6b562be..554de1b02f 100644 --- a/src/lib/constants.ts +++ b/src/lib/constants.ts @@ -9,5 +9,7 @@ export const BASE_PARAMS: RequestInit = { export const BASE_URL = process.env.REACT_APP_API_URL; export const TOPIC_NAME_VALIDATION_PATTERN = RegExp(/^[.,A-Za-z0-9_-]+$/); + export const MILLISECONDS_IN_DAY = 86_400_000; + export const BYTES_IN_GB = 1_073_741_824; diff --git a/src/lib/paths.ts b/src/lib/paths.ts index a0eccbb23b..ea137f7cb9 100644 --- a/src/lib/paths.ts +++ b/src/lib/paths.ts @@ -1,4 +1,7 @@ -import { ClusterId, TopicName } from 'lib/interfaces'; +import { + ClusterId, + TopicName, +} from 'redux/interfaces'; const clusterPath = (clusterId: ClusterId) => `/clusters/${clusterId}`; diff --git a/src/redux/reducers/topics/actionType.ts b/src/redux/actionType.ts similarity index 55% rename from src/redux/reducers/topics/actionType.ts rename to src/redux/actionType.ts index 29250575c2..a07b08b3ee 100644 --- a/src/redux/reducers/topics/actionType.ts +++ b/src/redux/actionType.ts @@ -1,4 +1,16 @@ -enum ActionType { +export enum ActionType { + GET_CLUSTERS__REQUEST = 'GET_CLUSTERS__REQUEST', + GET_CLUSTERS__SUCCESS = 'GET_CLUSTERS__SUCCESS', + GET_CLUSTERS__FAILURE = 'GET_CLUSTERS__FAILURE', + + GET_BROKERS__REQUEST = 'GET_BROKERS__REQUEST', + GET_BROKERS__SUCCESS = 'GET_BROKERS__SUCCESS', + GET_BROKERS__FAILURE = 'GET_BROKERS__FAILURE', + + GET_BROKER_METRICS__REQUEST = 'GET_BROKER_METRICS__REQUEST', + GET_BROKER_METRICS__SUCCESS = 'GET_BROKER_METRICS__SUCCESS', + GET_BROKER_METRICS__FAILURE = 'GET_BROKER_METRICS__FAILURE', + GET_TOPICS__REQUEST = 'GET_TOPICS__REQUEST', GET_TOPICS__SUCCESS = 'GET_TOPICS__SUCCESS', GET_TOPICS__FAILURE = 'GET_TOPICS__FAILURE', @@ -14,6 +26,4 @@ enum ActionType { POST_TOPIC__REQUEST = 'POST_TOPIC__REQUEST', POST_TOPIC__SUCCESS = 'POST_TOPIC__SUCCESS', POST_TOPIC__FAILURE = 'POST_TOPIC__FAILURE', -} - -export default ActionType; +}; diff --git a/src/redux/reducers/topics/actions.ts b/src/redux/actions/actions.ts similarity index 54% rename from src/redux/reducers/topics/actions.ts rename to src/redux/actions/actions.ts index 5dc79a350c..138231a4ea 100644 --- a/src/redux/reducers/topics/actions.ts +++ b/src/redux/actions/actions.ts @@ -1,6 +1,32 @@ import { createAsyncAction} from 'typesafe-actions'; -import ActionType from './actionType'; -import { Topic, TopicDetails, TopicName, TopicConfig} from 'lib/interfaces'; +import { ActionType } from 'redux/actionType'; +import { + Broker, + BrokerMetrics, + Cluster, + Topic, + TopicConfig, + TopicDetails, + TopicName, +} from 'redux/interfaces'; + +export const fetchBrokersAction = createAsyncAction( + ActionType.GET_BROKERS__REQUEST, + ActionType.GET_BROKERS__SUCCESS, + ActionType.GET_BROKERS__FAILURE, +)(); + +export const fetchBrokerMetricsAction = createAsyncAction( + ActionType.GET_BROKER_METRICS__REQUEST, + ActionType.GET_BROKER_METRICS__SUCCESS, + ActionType.GET_BROKER_METRICS__FAILURE, +)(); + +export const fetchClusterListAction = createAsyncAction( + ActionType.GET_CLUSTERS__REQUEST, + ActionType.GET_CLUSTERS__SUCCESS, + ActionType.GET_CLUSTERS__FAILURE, +)(); export const fetchTopicListAction = createAsyncAction( ActionType.GET_TOPICS__REQUEST, diff --git a/src/redux/actions/index.ts b/src/redux/actions/index.ts new file mode 100644 index 0000000000..166f708c81 --- /dev/null +++ b/src/redux/actions/index.ts @@ -0,0 +1,2 @@ +export * from './actions'; +export * from './thunks'; diff --git a/src/redux/actions/thunks.ts b/src/redux/actions/thunks.ts new file mode 100644 index 0000000000..8ce45a817f --- /dev/null +++ b/src/redux/actions/thunks.ts @@ -0,0 +1,79 @@ +import * as api from 'redux/api'; +import * as actions from './actions'; +import { + PromiseThunk, + Cluster, + ClusterId, + TopicFormData, + TopicName, +} from 'redux/interfaces'; + +export const fetchBrokers = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchBrokersAction.request()); + try { + const payload = await api.getBrokers(clusterId); + dispatch(actions.fetchBrokersAction.success(payload)); + } catch (e) { + dispatch(actions.fetchBrokersAction.failure()); + } +} + +export const fetchBrokerMetrics = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchBrokerMetricsAction.request()); + try { + const payload = await api.getBrokerMetrics(clusterId); + dispatch(actions.fetchBrokerMetricsAction.success(payload)); + } catch (e) { + dispatch(actions.fetchBrokerMetricsAction.failure()); + } +} + +export const fetchClustersList = (): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchClusterListAction.request()); + try { + const clusters: Cluster[] = await api.getClusters(); + dispatch(actions.fetchClusterListAction.success(clusters)); + } catch (e) { + dispatch(actions.fetchClusterListAction.failure()); + } +} + +export const fetchTopicList = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchTopicListAction.request()); + try { + const topics = await api.getTopics(clusterId); + dispatch(actions.fetchTopicListAction.success(topics)); + } catch (e) { + dispatch(actions.fetchTopicListAction.failure()); + } +} + +export const fetchTopicDetails = (clusterId: ClusterId, topicName: TopicName): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchTopicDetailsAction.request()); + try { + const topicDetails = await api.getTopicDetails(clusterId, topicName); + dispatch(actions.fetchTopicDetailsAction.success({ topicName, details: topicDetails })); + } catch (e) { + dispatch(actions.fetchTopicDetailsAction.failure()); + } +} + +export const fetchTopicConfig = (clusterId: ClusterId, topicName: TopicName): PromiseThunk => async (dispatch) => { + dispatch(actions.fetchTopicConfigAction.request()); + try { + const config = await api.getTopicConfig(clusterId, topicName); + dispatch(actions.fetchTopicConfigAction.success({ topicName, config })); + } catch (e) { + dispatch(actions.fetchTopicConfigAction.failure()); + } +} + +export const createTopic = (clusterId: ClusterId, form: TopicFormData): PromiseThunk => async (dispatch) => { + dispatch(actions.createTopicAction.request()); + try { + await api.postTopic(clusterId, form); + dispatch(actions.createTopicAction.success()); + } catch (e) { + dispatch(actions.createTopicAction.failure()); + } +} diff --git a/src/lib/api/brokers.ts b/src/redux/api/brokers.ts similarity index 94% rename from src/lib/api/brokers.ts rename to src/redux/api/brokers.ts index 3789222936..5ae1f19150 100644 --- a/src/lib/api/brokers.ts +++ b/src/redux/api/brokers.ts @@ -2,7 +2,7 @@ import { Broker, ClusterId, BrokerMetrics, -} from 'lib/interfaces'; +} from 'redux/interfaces'; import { BASE_URL, BASE_PARAMS, diff --git a/src/lib/api/clusters.ts b/src/redux/api/clusters.ts similarity index 88% rename from src/lib/api/clusters.ts rename to src/redux/api/clusters.ts index f4af3b482d..374e8cbe5c 100644 --- a/src/lib/api/clusters.ts +++ b/src/redux/api/clusters.ts @@ -1,6 +1,6 @@ import { Cluster, -} from 'lib/interfaces'; +} from 'redux/interfaces'; import { BASE_URL, BASE_PARAMS, diff --git a/src/lib/api/index.ts b/src/redux/api/index.ts similarity index 100% rename from src/lib/api/index.ts rename to src/redux/api/index.ts diff --git a/src/lib/api/topics.ts b/src/redux/api/topics.ts similarity index 98% rename from src/lib/api/topics.ts rename to src/redux/api/topics.ts index 2769b8441d..353f99564e 100644 --- a/src/lib/api/topics.ts +++ b/src/redux/api/topics.ts @@ -5,7 +5,7 @@ import { TopicDetails, TopicConfig, TopicFormData, -} from 'lib/interfaces'; +} from 'redux/interfaces'; import { BASE_URL, BASE_PARAMS, diff --git a/src/lib/interfaces/broker.ts b/src/redux/interfaces/broker.ts similarity index 100% rename from src/lib/interfaces/broker.ts rename to src/redux/interfaces/broker.ts diff --git a/src/lib/interfaces/cluster.ts b/src/redux/interfaces/cluster.ts similarity index 100% rename from src/lib/interfaces/cluster.ts rename to src/redux/interfaces/cluster.ts diff --git a/src/lib/interfaces/index.ts b/src/redux/interfaces/index.ts similarity index 71% rename from src/lib/interfaces/index.ts rename to src/redux/interfaces/index.ts index 62a6f81d24..9878a7d90c 100644 --- a/src/lib/interfaces/index.ts +++ b/src/redux/interfaces/index.ts @@ -2,9 +2,7 @@ import { AnyAction } from 'redux'; import { ActionType } from 'typesafe-actions'; import { ThunkAction } from 'redux-thunk'; -import * as topicsActions from 'redux/reducers/topics/actions'; -import * as clustersActions from 'redux/reducers/clusters/actions'; -import * as brokersActions from 'redux/reducers/brokers/actions'; +import * as actions from 'redux/actions/actions'; import { TopicsState } from './topic'; import { Cluster } from './cluster'; @@ -30,6 +28,6 @@ export interface RootState { loader: LoaderState; } -export type Action = ActionType; +export type Action = ActionType; export type PromiseThunk = ThunkAction, RootState, undefined, AnyAction>; diff --git a/src/lib/interfaces/loader.ts b/src/redux/interfaces/loader.ts similarity index 57% rename from src/lib/interfaces/loader.ts rename to src/redux/interfaces/loader.ts index 0ff91468cc..df4123c9d6 100644 --- a/src/lib/interfaces/loader.ts +++ b/src/redux/interfaces/loader.ts @@ -1,4 +1,4 @@ -import { FetchStatus } from 'lib/interfaces'; +import { FetchStatus } from 'redux/interfaces'; export interface LoaderState { [key: string]: FetchStatus; diff --git a/src/lib/interfaces/topic.ts b/src/redux/interfaces/topic.ts similarity index 100% rename from src/lib/interfaces/topic.ts rename to src/redux/interfaces/topic.ts diff --git a/src/redux/reducers/actionType.ts b/src/redux/reducers/actionType.ts deleted file mode 100644 index 33006ca457..0000000000 --- a/src/redux/reducers/actionType.ts +++ /dev/null @@ -1,9 +0,0 @@ -import topicsActionType from './topics/actionType'; -import clustersActionType from './clusters/actionType'; -import brokersActionType from './brokers/actionType'; - -export default { - ...topicsActionType, - ...clustersActionType, - ...brokersActionType, -}; diff --git a/src/redux/reducers/brokers/actionType.ts b/src/redux/reducers/brokers/actionType.ts deleted file mode 100644 index 075a2f1ed3..0000000000 --- a/src/redux/reducers/brokers/actionType.ts +++ /dev/null @@ -1,11 +0,0 @@ -enum ActionType { - GET_BROKERS__REQUEST = 'GET_BROKERS__REQUEST', - GET_BROKERS__SUCCESS = 'GET_BROKERS__SUCCESS', - GET_BROKERS__FAILURE = 'GET_BROKERS__FAILURE', - - GET_BROKER_METRICS__REQUEST = 'GET_BROKER_METRICS__REQUEST', - GET_BROKER_METRICS__SUCCESS = 'GET_BROKER_METRICS__SUCCESS', - GET_BROKER_METRICS__FAILURE = 'GET_BROKER_METRICS__FAILURE', -} - -export default ActionType; diff --git a/src/redux/reducers/brokers/actions.ts b/src/redux/reducers/brokers/actions.ts deleted file mode 100644 index a50af6e28c..0000000000 --- a/src/redux/reducers/brokers/actions.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { createAsyncAction} from 'typesafe-actions'; -import ActionType from './actionType'; -import { Broker, BrokerMetrics } from 'lib/interfaces'; - -export const fetchBrokersAction = createAsyncAction( - ActionType.GET_BROKERS__REQUEST, - ActionType.GET_BROKERS__SUCCESS, - ActionType.GET_BROKERS__FAILURE, -)(); - -export const fetchBrokerMetricsAction = createAsyncAction( - ActionType.GET_BROKER_METRICS__REQUEST, - ActionType.GET_BROKER_METRICS__SUCCESS, - ActionType.GET_BROKER_METRICS__FAILURE, -)(); diff --git a/src/redux/reducers/brokers/reducer.ts b/src/redux/reducers/brokers/reducer.ts index efd1d9a51b..3d73d60194 100644 --- a/src/redux/reducers/brokers/reducer.ts +++ b/src/redux/reducers/brokers/reducer.ts @@ -1,5 +1,12 @@ -import { Action, BrokersState, ZooKeeperStatus, BrokerMetrics } from 'lib/interfaces'; -import actionType from 'redux/reducers/actionType'; +import { + Action, + BrokersState, + ZooKeeperStatus, + BrokerMetrics, +} from 'redux/interfaces'; +import { + ActionType, +} from 'redux/actionType'; export const initialState: BrokersState = { items: [], @@ -32,14 +39,14 @@ const updateBrokerSegmentSize = (state: BrokersState, payload: BrokerMetrics) => const reducer = (state = initialState, action: Action): BrokersState => { switch (action.type) { - case actionType.GET_BROKERS__REQUEST: + case ActionType.GET_BROKERS__REQUEST: return initialState; - case actionType.GET_BROKERS__SUCCESS: + case ActionType.GET_BROKERS__SUCCESS: return { ...state, items: action.payload, }; - case actionType.GET_BROKER_METRICS__SUCCESS: + case ActionType.GET_BROKER_METRICS__SUCCESS: return updateBrokerSegmentSize(state, action.payload); default: return state; diff --git a/src/redux/reducers/brokers/selectors.ts b/src/redux/reducers/brokers/selectors.ts index 767a988818..71cc116d6f 100644 --- a/src/redux/reducers/brokers/selectors.ts +++ b/src/redux/reducers/brokers/selectors.ts @@ -1,5 +1,5 @@ import { createSelector } from 'reselect'; -import { RootState, FetchStatus, BrokersState } from 'lib/interfaces'; +import { RootState, FetchStatus, BrokersState } from 'redux/interfaces'; import { createFetchingSelector } from 'redux/reducers/loader/selectors'; const brokersState = ({ brokers }: RootState): BrokersState => brokers; @@ -29,7 +29,6 @@ export const getMinDiskUsage = createSelector( if (brokers.length === 0) { return 0; } - return Math.min(...brokers.map(({ segmentSize }) => segmentSize)); }, ); @@ -40,7 +39,6 @@ export const getMaxDiskUsage = createSelector( if (brokers.length === 0) { return 0; } - return Math.max(...brokers.map(({ segmentSize }) => segmentSize)); }, ); diff --git a/src/redux/reducers/brokers/thunks.ts b/src/redux/reducers/brokers/thunks.ts deleted file mode 100644 index 9dd07c3807..0000000000 --- a/src/redux/reducers/brokers/thunks.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { getBrokers, getBrokerMetrics } from 'lib/api'; -import { - fetchBrokersAction, - fetchBrokerMetricsAction, -} from './actions'; -import { PromiseThunk, ClusterId } from 'lib/interfaces'; - - -export const fetchBrokers = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { - dispatch(fetchBrokersAction.request()); - try { - const payload = await getBrokers(clusterId); - dispatch(fetchBrokersAction.success(payload)); - } catch (e) { - dispatch(fetchBrokersAction.failure()); - } -} - -export const fetchBrokerMetrics = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { - dispatch(fetchBrokerMetricsAction.request()); - try { - const payload = await getBrokerMetrics(clusterId); - dispatch(fetchBrokerMetricsAction.success(payload)); - } catch (e) { - dispatch(fetchBrokerMetricsAction.failure()); - } -} diff --git a/src/redux/reducers/clusters/actionType.ts b/src/redux/reducers/clusters/actionType.ts deleted file mode 100644 index e4856edcea..0000000000 --- a/src/redux/reducers/clusters/actionType.ts +++ /dev/null @@ -1,7 +0,0 @@ -enum ActionType { - GET_CLUSTERS__REQUEST = 'GET_CLUSTERS__REQUEST', - GET_CLUSTERS__SUCCESS = 'GET_CLUSTERS__SUCCESS', - GET_CLUSTERS__FAILURE = 'GET_CLUSTERS__FAILURE', -} - -export default ActionType; diff --git a/src/redux/reducers/clusters/actions.ts b/src/redux/reducers/clusters/actions.ts deleted file mode 100644 index 867643aa48..0000000000 --- a/src/redux/reducers/clusters/actions.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { createAsyncAction} from 'typesafe-actions'; -import ActionType from './actionType'; -import { Cluster } from 'lib/interfaces'; - -export const fetchClusterListAction = createAsyncAction( - ActionType.GET_CLUSTERS__REQUEST, - ActionType.GET_CLUSTERS__SUCCESS, - ActionType.GET_CLUSTERS__FAILURE, -)(); diff --git a/src/redux/reducers/clusters/reducer.ts b/src/redux/reducers/clusters/reducer.ts index e6f283b799..93dd8fbd53 100644 --- a/src/redux/reducers/clusters/reducer.ts +++ b/src/redux/reducers/clusters/reducer.ts @@ -1,11 +1,11 @@ -import { Cluster, Action } from 'lib/interfaces'; -import actionType from 'redux/reducers/actionType'; +import { Cluster, Action } from 'redux/interfaces'; +import { ActionType } from 'redux/actionType'; export const initialState: Cluster[] = []; const reducer = (state = initialState, action: Action): Cluster[] => { switch (action.type) { - case actionType.GET_CLUSTERS__SUCCESS: + case ActionType.GET_CLUSTERS__SUCCESS: return action.payload; default: return state; diff --git a/src/redux/reducers/clusters/selectors.ts b/src/redux/reducers/clusters/selectors.ts index 2df487f575..8ac3c5f0c1 100644 --- a/src/redux/reducers/clusters/selectors.ts +++ b/src/redux/reducers/clusters/selectors.ts @@ -1,5 +1,5 @@ import { createSelector } from 'reselect'; -import { Cluster, RootState, FetchStatus, ClusterStatus } from 'lib/interfaces'; +import { Cluster, RootState, FetchStatus, ClusterStatus } from 'redux/interfaces'; import { createFetchingSelector } from 'redux/reducers/loader/selectors'; const clustersState = ({ clusters }: RootState): Cluster[] => clusters; diff --git a/src/redux/reducers/clusters/thunks.ts b/src/redux/reducers/clusters/thunks.ts deleted file mode 100644 index 6c281faed4..0000000000 --- a/src/redux/reducers/clusters/thunks.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { - getClusters, -} from 'lib/api'; -import { - fetchClusterListAction, -} from './actions'; -import { Cluster, PromiseThunk } from 'lib/interfaces'; - -export const fetchClustersList = (): PromiseThunk => async (dispatch) => { - dispatch(fetchClusterListAction.request()); - - try { - const clusters: Cluster[] = await getClusters(); - - dispatch(fetchClusterListAction.success(clusters)); - } catch (e) { - dispatch(fetchClusterListAction.failure()); - } -} diff --git a/src/redux/reducers/index.ts b/src/redux/reducers/index.ts index c2b6cac28a..babf641ae0 100644 --- a/src/redux/reducers/index.ts +++ b/src/redux/reducers/index.ts @@ -3,7 +3,7 @@ import topics from './topics/reducer'; import clusters from './clusters/reducer'; import brokers from './brokers/reducer'; import loader from './loader/reducer'; -import { RootState } from 'lib/interfaces'; +import { RootState } from 'redux/interfaces'; export default combineReducers({ topics, diff --git a/src/redux/reducers/loader/reducer.ts b/src/redux/reducers/loader/reducer.ts index a60a2eaca5..ccb0722dfe 100644 --- a/src/redux/reducers/loader/reducer.ts +++ b/src/redux/reducers/loader/reducer.ts @@ -1,10 +1,14 @@ -import { FetchStatus, Action, LoaderState } from 'lib/interfaces'; +import { + FetchStatus, + Action, + LoaderState, +} from 'redux/interfaces'; export const initialState: LoaderState = {}; const reducer = (state = initialState, action: Action): LoaderState => { const { type } = action; - const matches = /(.*)__(REQUEST|SUCCESS|FAILURE)/.exec(type); + const matches = /(.*)__(REQUEST|SUCCESS|FAILURE)$/.exec(type); // not a *__REQUEST / *__SUCCESS / *__FAILURE actions, so we ignore them if (!matches) return state; diff --git a/src/redux/reducers/loader/selectors.ts b/src/redux/reducers/loader/selectors.ts index 3f43c75609..a6837497fa 100644 --- a/src/redux/reducers/loader/selectors.ts +++ b/src/redux/reducers/loader/selectors.ts @@ -1,4 +1,4 @@ -import { RootState, FetchStatus } from 'lib/interfaces'; +import { RootState, FetchStatus } from 'redux/interfaces'; export const createFetchingSelector = (action: string) => (state: RootState) => (state.loader[action] || FetchStatus.notFetched); diff --git a/src/redux/reducers/topics/reducer.ts b/src/redux/reducers/topics/reducer.ts index f2701da5df..4ed0a1fd1f 100644 --- a/src/redux/reducers/topics/reducer.ts +++ b/src/redux/reducers/topics/reducer.ts @@ -1,5 +1,5 @@ -import { Action, TopicsState, Topic } from 'lib/interfaces'; -import actionType from 'redux/reducers/actionType'; +import { Action, TopicsState, Topic } from 'redux/interfaces'; +import { ActionType } from 'redux/actionType'; export const initialState: TopicsState = { byName: {}, @@ -29,9 +29,9 @@ const updateTopicList = (state: TopicsState, payload: Topic[]) => { const reducer = (state = initialState, action: Action): TopicsState => { switch (action.type) { - case actionType.GET_TOPICS__SUCCESS: + case ActionType.GET_TOPICS__SUCCESS: return updateTopicList(state, action.payload); - case actionType.GET_TOPIC_DETAILS__SUCCESS: + case ActionType.GET_TOPIC_DETAILS__SUCCESS: return { ...state, byName: { @@ -42,7 +42,7 @@ const reducer = (state = initialState, action: Action): TopicsState => { } } } - case actionType.GET_TOPIC_CONFIG__SUCCESS: + case ActionType.GET_TOPIC_CONFIG__SUCCESS: return { ...state, byName: { diff --git a/src/redux/reducers/topics/selectors.ts b/src/redux/reducers/topics/selectors.ts index a071f31059..351d39286e 100644 --- a/src/redux/reducers/topics/selectors.ts +++ b/src/redux/reducers/topics/selectors.ts @@ -1,5 +1,5 @@ import { createSelector } from 'reselect'; -import { RootState, TopicName, FetchStatus, TopicsState } from 'lib/interfaces'; +import { RootState, TopicName, FetchStatus, TopicsState } from 'redux/interfaces'; import { createFetchingSelector } from 'redux/reducers/loader/selectors'; const topicsState = ({ topics }: RootState): TopicsState => topics; @@ -37,11 +37,10 @@ export const getTopicList = createSelector( getAllNames, getTopicMap, (isFetched, allNames, byName) => { - if (isFetched) { - return allNames.map((name) => byName[name]) + if (!isFetched) { + return []; } - - return []; + return allNames.map((name) => byName[name]) }, ); diff --git a/src/redux/reducers/topics/thunks.ts b/src/redux/reducers/topics/thunks.ts deleted file mode 100644 index 72c732a835..0000000000 --- a/src/redux/reducers/topics/thunks.ts +++ /dev/null @@ -1,54 +0,0 @@ -import { - getTopics, - getTopicDetails, - getTopicConfig, - postTopic, -} from 'lib/api'; -import { - fetchTopicListAction, - fetchTopicDetailsAction, - fetchTopicConfigAction, - createTopicAction, -} from './actions'; -import { PromiseThunk, ClusterId, TopicName, TopicFormData } from 'lib/interfaces'; - -export const fetchTopicList = (clusterId: ClusterId): PromiseThunk => async (dispatch) => { - dispatch(fetchTopicListAction.request()); - try { - const topics = await getTopics(clusterId); - dispatch(fetchTopicListAction.success(topics)); - } catch (e) { - dispatch(fetchTopicListAction.failure()); - } -} - -export const fetchTopicDetails = (clusterId: ClusterId, topicName: TopicName): PromiseThunk => async (dispatch) => { - dispatch(fetchTopicDetailsAction.request()); - try { - const topicDetails = await getTopicDetails(clusterId, topicName); - dispatch(fetchTopicDetailsAction.success({ topicName, details: topicDetails })); - } catch (e) { - dispatch(fetchTopicDetailsAction.failure()); - } -} - -export const fetchTopicConfig = (clusterId: ClusterId, topicName: TopicName): PromiseThunk => async (dispatch) => { - dispatch(fetchTopicConfigAction.request()); - try { - const config = await getTopicConfig(clusterId, topicName); - dispatch(fetchTopicConfigAction.success({ topicName, config })); - } catch (e) { - dispatch(fetchTopicConfigAction.failure()); - } -} - -export const createTopic = (clusterId: ClusterId, form: TopicFormData): PromiseThunk => async (dispatch) => { - dispatch(createTopicAction.request()); - - try { - await postTopic(clusterId, form); - dispatch(createTopicAction.success()); - } catch (e) { - dispatch(createTopicAction.failure()); - } -}