diff --git a/extension/src/app/api/importState.js b/extension/src/app/api/importState.js
index de5a6db0..02ae7447 100644
--- a/extension/src/app/api/importState.js
+++ b/extension/src/app/api/importState.js
@@ -1,6 +1,6 @@
 import mapValues from 'lodash/mapValues';
 import jsan from 'jsan';
-import seralizeImmutable from 'remotedev-serialize/immutable/serialize';
+import seralizeImmutable from '@redux-devtools/serialize/lib/immutable/serialize';
 
 function deprecate(param) {
   // eslint-disable-next-line no-console
diff --git a/extension/src/app/api/index.js b/extension/src/app/api/index.js
index 5c3e94ce..5590dbfb 100644
--- a/extension/src/app/api/index.js
+++ b/extension/src/app/api/index.js
@@ -1,7 +1,7 @@
 import jsan from 'jsan';
 import throttle from 'lodash/throttle';
-import seralizeImmutable from 'remotedev-serialize/immutable/serialize';
-import { getActionsArray } from 'remotedev-utils';
+import seralizeImmutable from '@redux-devtools/serialize/lib/immutable/serialize';
+import { getActionsArray } from '@redux-devtools/utils';
 import { getLocalFilter, isFiltered } from './filters';
 import importState from './importState';
 import generateId from './generateInstanceId';
diff --git a/extension/src/app/containers/App.js b/extension/src/app/containers/App.js
index a12d9c49..df23bcee 100644
--- a/extension/src/app/containers/App.js
+++ b/extension/src/app/containers/App.js
@@ -1,33 +1,12 @@
-import React, { Component, PropTypes } from 'react';
-import { bindActionCreators } from 'redux';
+import React, { Component } from 'react';
 import { connect } from 'react-redux';
-import SliderMonitor from 'remotedev-slider/lib/Slider';
-import { liftedDispatch, getReport } from 'remotedev-app/lib/actions';
-import { getActiveInstance } from 'remotedev-app/lib/reducers/instances';
-import styles from 'remotedev-app/lib/styles';
-import enhance from 'remotedev-app/lib/hoc';
-import DevTools from 'remotedev-app/lib/containers/DevTools';
-import Dispatcher from 'remotedev-app/lib/containers/monitors/Dispatcher';
-import MonitorSelector from 'remotedev-app/lib/components/MonitorSelector';
-import Notification from 'remotedev-app/lib/components/Notification';
-import Instances from 'remotedev-app/lib/components/Instances';
-import Button from 'remotedev-app/lib/components/Button';
-import RecordButton from 'remotedev-app/lib/components/buttons/RecordButton';
-import LockButton from 'remotedev-app/lib/components/buttons/LockButton';
-import DispatcherButton from 'remotedev-app/lib/components/buttons/DispatcherButton';
-import SliderButton from 'remotedev-app/lib/components/buttons/SliderButton';
-import ImportButton from 'remotedev-app/lib/components/buttons/ImportButton';
-import ExportButton from 'remotedev-app/lib/components/buttons/ExportButton';
-import PrintButton from 'remotedev-app/lib/components/buttons/PrintButton';
-import {
-  MdSettings,
-  MdBorderLeft,
-  MdBorderRight,
-  MdBorderBottom,
-} from 'react-icons/md';
-import { GoRadioTower, GoPin } from 'react-icons/go';
+import { Container, Notification } from 'devui';
+import { getActiveInstance } from '@redux-devtools/app/lib/reducers/instances';
+import Settings from '@redux-devtools/app/lib/components/Settings';
+import Actions from '@redux-devtools/app/lib/containers/Actions';
+import Header from '@redux-devtools/app/lib/components/Header';
+import { clearNotification } from '@redux-devtools/app/lib/actions';
 
-@enhance
 class App extends Component {
   openWindow = (position) => {
     chrome.runtime.sendMessage({ type: 'OPEN', position });
@@ -41,15 +20,7 @@ class App extends Component {
   };
 
   render() {
-    const {
-      monitor,
-      position,
-      togglePersist,
-      dispatcherIsOpen,
-      sliderIsOpen,
-      options,
-      liftedState,
-    } = this.props;
+    const { position, options, section, theme, notification } = this.props;
     if (!position && (!options || !options.features)) {
       return (
         <div style={{ padding: '20px', width: '100%', textAlign: 'center' }}>
@@ -64,139 +35,46 @@ class App extends Component {
         </div>
       );
     }
-    const features = options.features || {};
+
+    let body;
+    switch (section) {
+      case 'Settings':
+        body = <Settings />;
+        break;
+      default:
+        body = <Actions />;
+    }
+
     return (
-      <div style={styles.container}>
-        <div style={styles.buttonBar}>
-          <MonitorSelector selected={monitor} />
-          <Instances selected={this.props.selected} />
-        </div>
-        <DevTools
-          monitor={monitor}
-          liftedState={liftedState}
-          monitorState={this.props.monitorState}
-          dispatch={this.props.liftedDispatch}
-          lib={options.lib || options.explicitLib}
-        />
-        <Notification />
-        {sliderIsOpen && options.connectionId && options.features.jump && (
-          <SliderMonitor
-            monitor="SliderMonitor"
-            liftedState={liftedState}
-            dispatch={this.props.liftedDispatch}
-            getReport={this.props.getReport}
-            reports={this.props.reports}
-            showActions={monitor === 'ChartMonitor'}
-            style={{ padding: '15px 5px' }}
-            fillColor="rgb(120, 144, 156)"
-          />
+      <Container themeData={theme}>
+        <Header section={section} />
+        {body}
+        {notification && (
+          <Notification
+            type={notification.type}
+            onClose={this.props.clearNotification}
+          >
+            {notification.message}
+          </Notification>
         )}
-        {dispatcherIsOpen &&
-          options.connectionId &&
-          options.features.dispatch && <Dispatcher options={options} />}
-        <div style={styles.buttonBar}>
-          {!window.isElectron && position !== '#left' && (
-            <Button
-              Icon={MdBorderLeft}
-              onClick={() => {
-                this.openWindow('left');
-              }}
-            />
-          )}
-          {!window.isElectron && position !== '#right' && (
-            <Button
-              Icon={MdBorderRight}
-              onClick={() => {
-                this.openWindow('right');
-              }}
-            />
-          )}
-          {!window.isElectron && position !== '#bottom' && (
-            <Button
-              Icon={MdBorderBottom}
-              onClick={() => {
-                this.openWindow('bottom');
-              }}
-            />
-          )}
-          {features.pause && <RecordButton paused={liftedState.isPaused} />}
-          {features.lock && <LockButton locked={liftedState.isLocked} />}
-          {features.persist && (
-            <Button Icon={GoPin} onClick={togglePersist}>
-              Persist
-            </Button>
-          )}
-          {features.dispatch && (
-            <DispatcherButton dispatcherIsOpen={dispatcherIsOpen} />
-          )}
-          {features.jump && <SliderButton isOpen={sliderIsOpen} />}
-          {features.import && <ImportButton />}
-          {features.export && <ExportButton />}
-          {position &&
-            (position !== '#popup' ||
-              navigator.userAgent.indexOf('Firefox') !== -1) && <PrintButton />}
-          {!window.isElectron && (
-            <Button
-              Icon={GoRadioTower}
-              onClick={() => {
-                this.openWindow('remote');
-              }}
-            >
-              Remote
-            </Button>
-          )}
-          {(chrome.runtime.openOptionsPage ||
-            navigator.userAgent.indexOf('Firefox') !== -1) && (
-            <Button Icon={MdSettings} onClick={this.openOptionsPage}>
-              Settings
-            </Button>
-          )}
-        </div>
-      </div>
+      </Container>
     );
   }
 }
 
-App.propTypes = {
-  bgStore: PropTypes.object,
-  liftedDispatch: PropTypes.func.isRequired,
-  getReport: PropTypes.func.isRequired,
-  togglePersist: PropTypes.func.isRequired,
-  selected: PropTypes.string,
-  liftedState: PropTypes.object.isRequired,
-  monitorState: PropTypes.object,
-  options: PropTypes.object.isRequired,
-  monitor: PropTypes.string,
-  position: PropTypes.string,
-  reports: PropTypes.array.isRequired,
-  dispatcherIsOpen: PropTypes.bool,
-  sliderIsOpen: PropTypes.bool,
-};
-
 function mapStateToProps(state) {
   const instances = state.instances;
   const id = getActiveInstance(instances);
   return {
-    selected: instances.selected,
-    liftedState: instances.states[id],
-    monitorState: state.monitor.monitorState,
     options: instances.options[id],
-    monitor: state.monitor.selected,
-    dispatcherIsOpen: state.monitor.dispatcherIsOpen,
-    sliderIsOpen: state.monitor.sliderIsOpen,
-    reports: state.reports.data,
-    shouldSync: state.instances.sync,
+    section: state.section,
+    theme: state.theme,
+    notification: state.notification,
   };
 }
 
-function mapDispatchToProps(dispatch) {
-  return {
-    liftedDispatch: bindActionCreators(liftedDispatch, dispatch),
-    getReport: bindActionCreators(getReport, dispatch),
-    togglePersist: () => {
-      dispatch({ type: 'TOGGLE_PERSIST' });
-    },
-  };
-}
+const actionCreators = {
+  clearNotification,
+};
 
-export default connect(mapStateToProps, mapDispatchToProps)(App);
+export default connect(mapStateToProps, actionCreators)(App);
diff --git a/extension/src/app/middlewares/api.js b/extension/src/app/middlewares/api.js
index 6da750f4..785056d4 100644
--- a/extension/src/app/middlewares/api.js
+++ b/extension/src/app/middlewares/api.js
@@ -1,10 +1,10 @@
-import stringifyJSON from 'remotedev-app/lib/utils/stringifyJSON';
+import stringifyJSON from '@redux-devtools/app/lib/utils/stringifyJSON';
 import {
   UPDATE_STATE,
   REMOVE_INSTANCE,
   LIFTED_ACTION,
-} from 'remotedev-app/lib/constants/actionTypes';
-import { nonReduxDispatch } from 'remotedev-app/lib/utils/monitorActions';
+} from '@redux-devtools/app/lib/constants/actionTypes';
+import { nonReduxDispatch } from '@redux-devtools/app/lib/utils/monitorActions';
 import syncOptions from '../../browser/extension/options/syncOptions';
 import openDevToolsWindow from '../../browser/extension/background/openWindow';
 import { getReport } from '../../browser/extension/background/logging';
diff --git a/extension/src/app/middlewares/instanceSelector.js b/extension/src/app/middlewares/instanceSelector.js
index 6b300549..72c6d03d 100644
--- a/extension/src/app/middlewares/instanceSelector.js
+++ b/extension/src/app/middlewares/instanceSelector.js
@@ -1,7 +1,7 @@
 import {
   SELECT_INSTANCE,
   UPDATE_STATE,
-} from 'remotedev-app/lib/constants/actionTypes';
+} from '@redux-devtools/app/lib/constants/actionTypes';
 
 function selectInstance(tabId, store, next) {
   const instances = store.getState().instances;
diff --git a/extension/src/app/middlewares/panelSync.js b/extension/src/app/middlewares/panelSync.js
index 3f7a2691..f88f421d 100644
--- a/extension/src/app/middlewares/panelSync.js
+++ b/extension/src/app/middlewares/panelSync.js
@@ -2,8 +2,8 @@ import {
   LIFTED_ACTION,
   UPDATE_STATE,
   SELECT_INSTANCE,
-} from 'remotedev-app/lib/constants/actionTypes';
-import { getActiveInstance } from 'remotedev-app/lib/reducers/instances';
+} from '@redux-devtools/app/lib/constants/actionTypes';
+import { getActiveInstance } from '@redux-devtools/app/lib/reducers/instances';
 
 function panelDispatcher(bgConnection) {
   let autoselected = false;
diff --git a/extension/src/app/middlewares/windowSync.js b/extension/src/app/middlewares/windowSync.js
index ba6f3249..442d3162 100644
--- a/extension/src/app/middlewares/windowSync.js
+++ b/extension/src/app/middlewares/windowSync.js
@@ -1,8 +1,8 @@
 import {
   UPDATE_STATE,
   LIFTED_ACTION,
-} from 'remotedev-app/lib/constants/actionTypes';
-import { getActiveInstance } from 'remotedev-app/lib/reducers/instances';
+} from '@redux-devtools/app/lib/constants/actionTypes';
+import { getActiveInstance } from '@redux-devtools/app/lib/reducers/instances';
 
 const syncStores = (baseStore) => (store) => (next) => (action) => {
   if (action.type === UPDATE_STATE) {
diff --git a/extension/src/app/reducers/background/index.js b/extension/src/app/reducers/background/index.js
index 8b3e1af6..81bd41c6 100644
--- a/extension/src/app/reducers/background/index.js
+++ b/extension/src/app/reducers/background/index.js
@@ -1,5 +1,5 @@
 import { combineReducers } from 'redux';
-import instances from 'remotedev-app/lib/reducers/instances';
+import instances from '@redux-devtools/app/lib/reducers/instances';
 import persistStates from './persistStates';
 
 const rootReducer = combineReducers({
diff --git a/extension/src/app/reducers/panel/index.js b/extension/src/app/reducers/panel/index.js
index c39dd110..42cc531f 100644
--- a/extension/src/app/reducers/panel/index.js
+++ b/extension/src/app/reducers/panel/index.js
@@ -1,16 +1,18 @@
 import { combineReducers } from 'redux';
-import instances from 'remotedev-app/lib/reducers/instances';
-import monitor from 'remotedev-app/lib/reducers/monitor';
-import notification from 'remotedev-app/lib/reducers/notification';
-import test from 'remotedev-app/lib/reducers/test';
-import reports from 'remotedev-app/lib/reducers/reports';
+import instances from '@redux-devtools/app/lib/reducers/instances';
+import monitor from '@redux-devtools/app/lib/reducers/monitor';
+import notification from '@redux-devtools/app/lib/reducers/notification';
+import reports from '@redux-devtools/app/lib/reducers/reports';
+import section from '@redux-devtools/app/lib/reducers/section';
+import theme from '@redux-devtools/app/lib/reducers/theme';
 
 const rootReducer = combineReducers({
   instances,
   monitor,
-  test,
   reports,
   notification,
+  section,
+  theme,
 });
 
 export default rootReducer;
diff --git a/extension/src/app/reducers/window/index.js b/extension/src/app/reducers/window/index.js
index 7eec07c2..5420e736 100644
--- a/extension/src/app/reducers/window/index.js
+++ b/extension/src/app/reducers/window/index.js
@@ -1,18 +1,20 @@
 import { combineReducers } from 'redux';
 import instances from './instances';
-import monitor from 'remotedev-app/lib/reducers/monitor';
-import notification from 'remotedev-app/lib/reducers/notification';
-import socket from 'remotedev-app/lib/reducers/socket';
-import reports from 'remotedev-app/lib/reducers/reports';
-import test from 'remotedev-app/lib/reducers/test';
+import monitor from '@redux-devtools/app/lib/reducers/monitor';
+import notification from '@redux-devtools/app/lib/reducers/notification';
+import socket from '@redux-devtools/app/lib/reducers/socket';
+import reports from '@redux-devtools/app/lib/reducers/reports';
+import section from '@redux-devtools/app/lib/reducers/section';
+import theme from '@redux-devtools/app/lib/reducers/theme';
 
 const rootReducer = combineReducers({
   instances,
   monitor,
-  test,
   socket,
   reports,
   notification,
+  section,
+  theme,
 });
 
 export default rootReducer;
diff --git a/extension/src/app/reducers/window/instances.js b/extension/src/app/reducers/window/instances.js
index 3969367f..7454eb90 100644
--- a/extension/src/app/reducers/window/instances.js
+++ b/extension/src/app/reducers/window/instances.js
@@ -1,12 +1,12 @@
 import {
   initialState,
   dispatchAction,
-} from 'remotedev-app/lib/reducers/instances';
+} from '@redux-devtools/app/lib/reducers/instances';
 import {
   UPDATE_STATE,
   SELECT_INSTANCE,
   LIFTED_ACTION,
-} from 'remotedev-app/lib/constants/actionTypes';
+} from '@redux-devtools/app/lib/constants/actionTypes';
 
 export default function instances(state = initialState, action) {
   switch (action.type) {
diff --git a/extension/src/app/stores/enhancerStore.js b/extension/src/app/stores/enhancerStore.js
index e09d1737..fdf2a850 100644
--- a/extension/src/app/stores/enhancerStore.js
+++ b/extension/src/app/stores/enhancerStore.js
@@ -1,6 +1,6 @@
 import { compose } from 'redux';
-import instrument from 'redux-devtools-instrument';
-import persistState from 'redux-devtools/lib/persistState';
+import instrument from '@redux-devtools/instrument';
+import persistState from '@redux-devtools/core/lib/persistState';
 
 export function getUrlParam(key) {
   const matches = window.location.href.match(
diff --git a/extension/src/app/stores/panelStore.js b/extension/src/app/stores/panelStore.js
index cbd3b806..2255bc22 100644
--- a/extension/src/app/stores/panelStore.js
+++ b/extension/src/app/stores/panelStore.js
@@ -1,14 +1,9 @@
 import { createStore, applyMiddleware } from 'redux';
-import persist from 'remotedev-app/lib/middlewares/persist';
-import exportState from 'remotedev-app/lib/middlewares/exportState';
+import exportState from '@redux-devtools/app/lib/middlewares/exportState';
 import panelDispatcher from '../middlewares/panelSync';
 import rootReducer from '../reducers/panel';
 
 export default function configureStore(position, bgConnection, preloadedState) {
-  const enhancer = applyMiddleware(
-    exportState,
-    panelDispatcher(bgConnection),
-    persist(position)
-  );
+  const enhancer = applyMiddleware(exportState, panelDispatcher(bgConnection));
   return createStore(rootReducer, preloadedState, enhancer);
 }
diff --git a/extension/src/app/stores/windowStore.js b/extension/src/app/stores/windowStore.js
index e9eb22c8..2e67ef96 100644
--- a/extension/src/app/stores/windowStore.js
+++ b/extension/src/app/stores/windowStore.js
@@ -1,20 +1,14 @@
 import { createStore, compose, applyMiddleware } from 'redux';
-import persist from 'remotedev-app/lib/middlewares/persist';
-import exportState from 'remotedev-app/lib/middlewares/exportState';
-import api from 'remotedev-app/lib/middlewares/api';
-import { CONNECT_REQUEST } from 'remotedev-app/lib/constants/socketActionTypes';
+import exportState from '@redux-devtools/app/lib/middlewares/exportState';
+import api from '@redux-devtools/app/lib/middlewares/api';
+import { CONNECT_REQUEST } from '@redux-devtools/app/lib/constants/socketActionTypes';
 import syncStores from '../middlewares/windowSync';
 import instanceSelector from '../middlewares/instanceSelector';
 import rootReducer from '../reducers/window';
 
 export default function configureStore(baseStore, position, preloadedState) {
   let enhancer;
-  const middlewares = [
-    exportState,
-    api,
-    syncStores(baseStore),
-    persist(position),
-  ];
+  const middlewares = [exportState, api, syncStores(baseStore)];
   if (!position || position === '#popup') {
     // select current tab instance for devPanel and pageAction
     middlewares.push(instanceSelector);
diff --git a/extension/src/browser/extension/background/logging.js b/extension/src/browser/extension/background/logging.js
index ed937e9a..bc5a231c 100644
--- a/extension/src/browser/extension/background/logging.js
+++ b/extension/src/browser/extension/background/logging.js
@@ -1,4 +1,4 @@
-import { LIFTED_ACTION } from 'remotedev-app/lib/constants/actionTypes';
+import { LIFTED_ACTION } from '@redux-devtools/app/lib/constants/actionTypes';
 
 export function getReport(reportId, tabId, instanceId) {
   chrome.storage.local.get(['s:hostname', 's:port', 's:secure'], (options) => {
diff --git a/extension/src/browser/extension/devpanel/index.js b/extension/src/browser/extension/devpanel/index.js
index 4d346054..b9957d1c 100644
--- a/extension/src/browser/extension/devpanel/index.js
+++ b/extension/src/browser/extension/devpanel/index.js
@@ -1,8 +1,7 @@
-import 'remotedev-monitor-components/lib/presets';
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 import { Provider } from 'react-redux';
-import { REMOVE_INSTANCE } from 'remotedev-app/lib/constants/actionTypes';
+import { REMOVE_INSTANCE } from '@redux-devtools/app/lib/constants/actionTypes';
 import App from '../../../app/containers/App';
 import configureStore from '../../../app/stores/panelStore';
 import getPreloadedState from '../background/getPreloadedState';
diff --git a/extension/src/browser/extension/inject/pageScript.js b/extension/src/browser/extension/inject/pageScript.js
index 52046ae6..a2b6d5a1 100644
--- a/extension/src/browser/extension/inject/pageScript.js
+++ b/extension/src/browser/extension/inject/pageScript.js
@@ -1,4 +1,4 @@
-import { getActionsArray, evalAction } from 'remotedev-utils';
+import { getActionsArray, evalAction } from '@redux-devtools/utils';
 import throttle from 'lodash/throttle';
 import createStore from '../../../app/stores/createStore';
 import configureStore, { getUrlParam } from '../../../app/stores/enhancerStore';
diff --git a/extension/src/browser/extension/window/index.js b/extension/src/browser/extension/window/index.js
index 3071b27c..e1f1260f 100644
--- a/extension/src/browser/extension/window/index.js
+++ b/extension/src/browser/extension/window/index.js
@@ -1,8 +1,7 @@
-import 'remotedev-monitor-components/lib/presets';
 import React from 'react';
 import { render } from 'react-dom';
 import { Provider } from 'react-redux';
-import { UPDATE_STATE } from 'remotedev-app/lib/constants/actionTypes';
+import { UPDATE_STATE } from '@redux-devtools/app/lib/constants/actionTypes';
 import App from '../../../app/containers/App';
 import configureStore from '../../../app/stores/windowStore';
 import getPreloadedState from '../background/getPreloadedState';
diff --git a/extension/src/browser/extension/window/remote.js b/extension/src/browser/extension/window/remote.js
index 41e354f6..e4e271e6 100644
--- a/extension/src/browser/extension/window/remote.js
+++ b/extension/src/browser/extension/window/remote.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from 'react-dom';
-import App from 'remotedev-app';
+import App from '@redux-devtools/app';
 
 import '../../views/remote.pug';