chore: get rid of webpack resolve alias

21 files changed, 99 insertions, 92 deletions

diff --git a/src/components/APIConfig.js b/src/components/APIConfig.js
index 51648ef..b4652bc 100644
--- a/src/components/APIConfig.js
+++ b/src/components/APIConfig.js
@@ -1,13 +1,13 @@
 import React from 'react';
-import { useStoreState, useActions } from 'm/store';
+import { useStoreState, useActions } from '../misc/store';
 
-import Field from 'c/Field';
-import Button from 'c/Button';
+import Field from './Field';
+import Button from './Button';
 import SvgYacd from './SvgYacd';
 
 import s0 from './APIConfig.module.css';
 
-import { getClashAPIConfig, updateClashAPIConfig } from 'd/app';
+import { getClashAPIConfig, updateClashAPIConfig } from '../ducks/app';
 
 const { useState, useEffect, useRef, useCallback } = React;
 
diff --git a/src/components/APIDiscovery.js b/src/components/APIDiscovery.js
index b5ce1f9..16c8b62 100644
--- a/src/components/APIDiscovery.js
+++ b/src/components/APIDiscovery.js
@@ -1,13 +1,12 @@
 import React, { useEffect } from 'react';
-import { useActions, useStoreState } from 'm/store';
-
-import Modal from 'c/Modal';
-import APIConfig from 'c/APIConfig';
+import { useActions, useStoreState } from '../misc/store';
+import { DOES_NOT_SUPPORT_FETCH, errors } from '../misc/errors';
 
-import { closeModal } from 'd/modals';
-import { fetchConfigs } from 'd/configs';
+import Modal from './Modal';
+import APIConfig from './APIConfig';
 
-import { DOES_NOT_SUPPORT_FETCH, errors } from '../misc/errors';
+import { closeModal } from '../ducks/modals';
+import { fetchConfigs } from '../ducks/configs';
 
 import s0 from './APIDiscovery.module.css';
 
diff --git a/src/components/Button.js b/src/components/Button.js
index 5b0365b..d9bcd22 100644
--- a/src/components/Button.js
+++ b/src/components/Button.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
 
-import s0 from 'c/Button.module.css';
+import s0 from './Button.module.css';
 const noop = () => {};
 
 const { memo, forwardRef } = React;
diff --git a/src/components/Config.js b/src/components/Config.js
index a15e858..1342354 100644
--- a/src/components/Config.js
+++ b/src/components/Config.js
@@ -1,23 +1,23 @@
 import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import { useStoreState, useActions } from 'm/store';
+import { useStoreState, useActions } from '../misc/store';
 
-import { getConfigs, fetchConfigs, updateConfigs } from 'd/configs';
+import { getConfigs, fetchConfigs, updateConfigs } from '../ducks/configs';
 import {
   clearStorage,
   selectChartStyleIndex,
   getSelectedChartStyleIndex
-} from 'd/app';
+} from '../ducks/app';
 
-import ContentHeader from 'c/ContentHeader';
-import Switch from 'c/Switch';
-import ToggleSwitch from 'c/ToggleSwitch';
-import Input from 'c/Input';
-import Button from 'c/Button';
-import Selection from 'c/Selection';
-import TrafficChartSample from 'c/TrafficChartSample';
+import ContentHeader from './ContentHeader';
+import Switch from './Switch';
+import ToggleSwitch from './ToggleSwitch';
+import Input from './Input';
+import Button from './Button';
+import Selection from './Selection';
+import TrafficChartSample from './TrafficChartSample';
 
-import s0 from 'c/Config.module.css';
+import s0 from './Config.module.css';
 
 const propsList = [{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }];
 
diff --git a/src/components/Connections.js b/src/components/Connections.js
index 5dbccec..c07de0a 100644
--- a/src/components/Connections.js
+++ b/src/components/Connections.js
@@ -1,9 +1,9 @@
 import React from 'react';
-import ContentHeader from 'c/ContentHeader';
-import ConnectionTable from 'c/ConnectionTable';
+import ContentHeader from './ContentHeader';
+import ConnectionTable from './ConnectionTable';
 import useRemainingViewPortHeight from '../hooks/useRemainingViewPortHeight';
-import { useStoreState } from 'm/store';
-import { getClashAPIConfig } from 'd/app';
+import { useStoreState } from '../misc/store';
+import { getClashAPIConfig } from '../ducks/app';
 import { X as IconClose } from 'react-feather';
 import SvgYacd from './SvgYacd';
 import { ButtonWithIcon } from './Button';
diff --git a/src/components/ErrorBoundary.js b/src/components/ErrorBoundary.js
index 05ba9e0..25fb80c 100644
--- a/src/components/ErrorBoundary.js
+++ b/src/components/ErrorBoundary.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { getSentry } from '../misc/sentry';
-import ErrorBoundaryFallback from 'c/ErrorBoundaryFallback';
+import ErrorBoundaryFallback from './ErrorBoundaryFallback';
 import { deriveMessageFromError } from '../misc/errors';
 
 // XXX this is no Hook equivalents for componentDidCatch
diff --git a/src/components/Home.js b/src/components/Home.js
index bc5b608..c59180f 100644
--- a/src/components/Home.js
+++ b/src/components/Home.js
@@ -1,10 +1,10 @@
 import React, { Suspense } from 'react';
 
-import ContentHeader from 'c/ContentHeader';
-import TrafficChart from 'c/TrafficChart';
-import TrafficNow from 'c/TrafficNow';
-import Loading from 'c/Loading';
-import s0 from 'c/Home.module.css';
+import ContentHeader from './ContentHeader';
+import TrafficChart from './TrafficChart';
+import TrafficNow from './TrafficNow';
+import Loading from './Loading';
+import s0 from './Home.module.css';
 
 export default function Home() {
   return (
diff --git a/src/components/LogSearch.js b/src/components/LogSearch.js
index dd43c8a..0b5bec2 100644
--- a/src/components/LogSearch.js
+++ b/src/components/LogSearch.js
@@ -1,5 +1,5 @@
 import Search from './Search';
-import { getSearchText, updateSearchText } from 'd/logs';
+import { getSearchText, updateSearchText } from '../ducks/logs';
 
 const mapStateToProps = s => ({ searchText: getSearchText(s) });
 const actions = { updateSearchText };
diff --git a/src/components/Logs.js b/src/components/Logs.js
index ea2f58e..9b4950e 100644
--- a/src/components/Logs.js
+++ b/src/components/Logs.js
@@ -1,20 +1,19 @@
 import React, { memo, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
-import { useStoreState, useActions } from 'm/store';
-import { getClashAPIConfig } from 'd/app';
+import { useStoreState, useActions } from '../misc/store';
+import { getClashAPIConfig } from '../ducks/app';
 
 import SvgYacd from './SvgYacd';
 import { FixedSizeList as List, areEqual } from 'react-window';
-import ContentHeader from 'c/ContentHeader';
+import ContentHeader from './ContentHeader';
 import useRemainingViewPortHeight from '../hooks/useRemainingViewPortHeight';
-// TODO move this into a redux action
 import { fetchLogs } from '../api/logs';
 import LogSearch from './LogSearch';
-import { getLogsForDisplay, appendLog } from 'd/logs';
-import { getLogLevel } from 'd/configs';
+import { getLogsForDisplay, appendLog } from '../ducks/logs';
+import { getLogLevel } from '../ducks/configs';
 
-import s0 from 'c/Logs.module.css';
+import s0 from './Logs.module.css';
 const paddingBottom = 30;
 const colors = {
   debug: 'none',
diff --git a/src/components/Proxies.js b/src/components/Proxies.js
index 0020114..eb0f78b 100644
--- a/src/components/Proxies.js
+++ b/src/components/Proxies.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useStoreState } from 'm/store';
+import { useStoreState } from '../misc/store';
 
 import { connect } from './StateProvider';
 
diff --git a/src/components/Root.js b/src/components/Root.js
index 217d79d..460c882 100644
--- a/src/components/Root.js
+++ b/src/components/Root.js
@@ -2,14 +2,15 @@ import React, { Suspense } from 'react';
 import { Provider } from '../misc/store';
 import StateProvider from './StateProvider';
 import { HashRouter as Router, Route } from 'react-router-dom';
-import Loading2 from 'c/Loading2';
-import ErrorBoundary from 'c/ErrorBoundary';
-import SideBar from 'c/SideBar';
-import Home from 'c/Home';
-import Logs from 'c/Logs';
-import Config from 'c/Config';
-import Connections from 'c/Connections';
-import APIDiscovery from 'c/APIDiscovery';
+import Loading2 from './Loading2';
+import ErrorBoundary from './ErrorBoundary';
+import SideBar from './SideBar';
+import Home from './Home';
+import Logs from './Logs';
+import Config from './Config';
+import StyleGuide from './StyleGuide';
+import Connections from './Connections';
+import APIDiscovery from './APIDiscovery';
 import { store } from '../store/configureStore';
 import './Root.css';
 import s0 from './Root.module.css';
@@ -31,9 +32,6 @@ const Rules = React.lazy(() =>
   )
 );
 
-// testing...
-// import StyleGuide from 'c/StyleGuide';
-
 window.store = store;
 
 const initialState = {
@@ -44,6 +42,16 @@ const initialState = {
   }
 };
 
+const routes = [
+  ['home', '/', Home],
+  ['connections', '/connections', Connections],
+  ['configs', '/configs', Config],
+  ['logs', '/logs', Logs],
+  ['proxies', '/proxies', Proxies],
+  ['rules', '/rules', Rules],
+  __DEV__ ? ['style', '/style', StyleGuide] : false
+].filter(Boolean);
+
 const Root = () => (
   <ErrorBoundary>
     <StateProvider initialState={initialState}>
@@ -54,13 +62,9 @@ const Root = () => (
             <Route path="/" render={props => <SideBar {...props} />} />
             <div className={s0.content}>
               <Suspense fallback={<Loading2 />}>
-                <Route exact path="/" render={() => <Home />} />
-                <Route exact path="/connections" component={Connections} />
-                <Route exact path="/overview" render={() => <Home />} />
-                <Route exact path="/configs" component={Config} />
-                <Route exact path="/logs" component={Logs} />
-                <Route exact path="/proxies" render={() => <Proxies />} />
-                <Route exact path="/rules" render={() => <Rules />} />
+                {routes.map(([key, path, component]) => (
+                  <Route exact key={key} path={path} component={component} />
+                ))}
               </Suspense>
             </div>
           </div>
diff --git a/src/components/RuleSearch.js b/src/components/RuleSearch.js
index fa32229..d23f4d2 100644
--- a/src/components/RuleSearch.js
+++ b/src/components/RuleSearch.js
@@ -1,5 +1,5 @@
 import Search from './Search';
-import { getSearchText, updateSearchText } from 'd/rules';
+import { getSearchText, updateSearchText } from '../ducks/rules';
 
 const mapStateToProps = s => ({ searchText: getSearchText(s) });
 const actions = { updateSearchText };
diff --git a/src/components/Rules.js b/src/components/Rules.js
index 2e2db3c..e881443 100644
--- a/src/components/Rules.js
+++ b/src/components/Rules.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { useActions, useStoreState } from 'm/store';
-import { ButtonWithIcon } from 'c/Button';
+import { useActions, useStoreState } from '../misc/store';
+import { ButtonWithIcon } from './Button';
 import { FixedSizeList as List, areEqual } from 'react-window';
 import { RotateCw } from 'react-feather';
 
-import ContentHeader from 'c/ContentHeader';
-import Rule from 'c/Rule';
-import RuleSearch from 'c/RuleSearch';
+import ContentHeader from './ContentHeader';
+import Rule from './Rule';
+import RuleSearch from './RuleSearch';
 import useRemainingViewPortHeight from '../hooks/useRemainingViewPortHeight';
 
-import { getRules, fetchRules, fetchRulesOnce } from 'd/rules';
+import { getRules, fetchRules, fetchRulesOnce } from '../ducks/rules';
 
 const { memo, useEffect, useMemo } = React;
 
diff --git a/src/components/Search.js b/src/components/Search.js
index b93d429..a59ffce 100644
--- a/src/components/Search.js
+++ b/src/components/Search.js
@@ -1,8 +1,8 @@
 import React, { memo, useState, useMemo } from 'react';
-import Icon from 'c/Icon';
+import Icon from './Icon';
 
-import search from 's/search.svg';
-import { useActions, useStoreState } from 'm/store';
+import search from '../svg/search.svg';
+import { useActions, useStoreState } from '../misc/store';
 
 import debounce from 'lodash-es/debounce';
 
diff --git a/src/components/SideBar.js b/src/components/SideBar.js
index b70a672..99a28c1 100644
--- a/src/components/SideBar.js
+++ b/src/components/SideBar.js
@@ -4,16 +4,13 @@ import cx from 'classnames';
 import { Link } from 'react-router-dom';
 import { Command, Activity, Globe, Link2, Settings, File } from 'react-feather';
 
-import { useActions } from 'm/store';
-import { switchTheme } from 'd/app';
-
-import Icon from 'c/Icon';
-
-import moon from 's/moon.svg';
+import { useActions } from '../misc/store';
+import { switchTheme } from '../ducks/app';
 
+import Icon from './Icon';
+import moon from '../svg/moon.svg';
 import SvgYacd from './SvgYacd';
-
-import s from 'c/SideBar.module.css';
+import s from './SideBar.module.css';
 
 const icons = {
   activity: Activity,
diff --git a/src/components/StyleGuide.js b/src/components/StyleGuide.js
index d96e397..7b6f53d 100644
--- a/src/components/StyleGuide.js
+++ b/src/components/StyleGuide.js
@@ -1,10 +1,10 @@
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 
-import ToggleSwitch from 'c/ToggleSwitch';
-import Input from 'c/Input';
-import Switch from 'c/Switch';
-import Button from 'c/Button';
+import ToggleSwitch from './ToggleSwitch';
+import Input from './Input';
+import Switch from './Switch';
+import Button from './Button';
 // import Modal from 'c/Modal';
 // import APIConfig from 'c/APIConfig';
 // import Proxy from 'c/Proxy';
diff --git a/src/components/Switch.js b/src/components/Switch.js
index 8062af2..afc4b5b 100644
--- a/src/components/Switch.js
+++ b/src/components/Switch.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import s0 from 'c/Switch.module.css';
+import s0 from './Switch.module.css';
 const noop = () => {};
 
 function Switch({ checked = false, onChange = noop, name = '' }) {
diff --git a/src/components/ToggleSwitch.js b/src/components/ToggleSwitch.js
index 7d6431c..f04407d 100644
--- a/src/components/ToggleSwitch.js
+++ b/src/components/ToggleSwitch.js
@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 
-import s0 from 'c/ToggleSwitch.module.css';
+import s0 from './ToggleSwitch.module.css';
 
 function ToggleSwitch({ options, value, name, onChange }) {
   const idxSelected = useMemo(() => options.map(o => o.value).indexOf(value), [
diff --git a/src/components/TrafficChart.js b/src/components/TrafficChart.js
index cd9e853..f0b4b62 100644
--- a/src/components/TrafficChart.js
+++ b/src/components/TrafficChart.js
@@ -1,9 +1,13 @@
 import React, { useMemo } from 'react';
 import { fetchData } from '../api/traffic';
 import useLineChart from '../hooks/useLineChart';
-import { useStoreState } from 'm/store';
-import { getClashAPIConfig, getSelectedChartStyleIndex } from 'd/app';
-import { chartJSResource, commonDataSetProps, chartStyles } from 'm/chart';
+import { useStoreState } from '../misc/store';
+import { getClashAPIConfig, getSelectedChartStyleIndex } from '../ducks/app';
+import {
+  chartJSResource,
+  commonDataSetProps,
+  chartStyles
+} from '../misc/chart';
 
 const chartWrapperStyle = {
   // make chartjs chart responsive
diff --git a/src/components/TrafficChartSample.js b/src/components/TrafficChartSample.js
index 92c19b6..f59afe7 100644
--- a/src/components/TrafficChartSample.js
+++ b/src/components/TrafficChartSample.js
@@ -1,6 +1,10 @@
 import React, { useMemo } from 'react';
 import useLineChart from '../hooks/useLineChart';
-import { chartJSResource, commonDataSetProps, chartStyles } from 'm/chart';
+import {
+  chartJSResource,
+  commonDataSetProps,
+  chartStyles
+} from '../misc/chart';
 
 const extraChartOptions = {
   legend: {
diff --git a/src/components/TrafficNow.js b/src/components/TrafficNow.js
index f673337..73bdffe 100644
--- a/src/components/TrafficNow.js
+++ b/src/components/TrafficNow.js
@@ -1,12 +1,12 @@
 import React from 'react';
-import prettyBytes from 'm/pretty-bytes';
+import prettyBytes from '../misc/pretty-bytes';
 
-import { useStoreState } from 'm/store';
-import { getClashAPIConfig } from 'd/app';
+import { useStoreState } from '../misc/store';
+import { getClashAPIConfig } from '../ducks/app';
 import { fetchData } from '../api/traffic';
 import * as connAPI from '../api/connections';
 
-import s0 from 'c/TrafficNow.module.css';
+import s0 from './TrafficNow.module.css';
 
 const { useState, useEffect, useCallback } = React;