diff --git a/src/components/AppDrawer/index.jsx b/src/components/AppDrawer/index.jsx
index 46d75a1a..f634d55f 100644
--- a/src/components/AppDrawer/index.jsx
+++ b/src/components/AppDrawer/index.jsx
@@ -39,6 +39,7 @@ const AppDrawer = ({
onClose={toggleDrawerOff}
variant={isPermanent ? 'permanent' : 'temporary'}
PaperProps={{ style: { width, top: 'auto' } }}
+ ModalProps={{ keepMounted: true }}
>
{!isPermanent
diff --git a/src/components/Dashboard/DeviceList.jsx b/src/components/Dashboard/DeviceList.jsx
index 591cb17f..9da3ce1f 100644
--- a/src/components/Dashboard/DeviceList.jsx
+++ b/src/components/Dashboard/DeviceList.jsx
@@ -11,6 +11,7 @@ import { devices as Devices } from '@commaai/api';
import { updateDevices } from '../../actions';
import Colors from '../../colors';
+import { getDeviceSettings } from '../../url';
import { deviceNamePretty, deviceIsOnline, filterRegularClick, emptyDevice } from '../../utils';
import VisibilityHandler from '../VisibilityHandler';
@@ -90,7 +91,7 @@ class DeviceList extends Component {
super(props);
this.state = {
- settingsModalDongleId: null,
+ settingsModalDongleId: getDeviceSettings(window.location.pathname),
};
this.renderDevice = this.renderDevice.bind(this);
@@ -107,6 +108,9 @@ class DeviceList extends Component {
handleClosedSettingsModal() {
this.setState({ settingsModalDongleId: null });
+ if (window.location.pathname.endsWith('/settings')) {
+ window.history.replaceState(null, '', `/${this.props.selectedDevice}`);
+ }
}
async onVisible() {
diff --git a/src/url.js b/src/url.js
index 75b8d592..10179e0f 100644
--- a/src/url.js
+++ b/src/url.js
@@ -46,4 +46,12 @@ export function getPrimeNav(pathname) {
return true;
}
return false;
-}
\ No newline at end of file
+}
+
+export function getDeviceSettings(pathname) {
+ const parts = pathname.split('/').filter((m) => m.length);
+ if (parts.length === 2 && dongleIdRegex.test(parts[0]) && parts[1] === 'settings') {
+ return parts[0];
+ }
+ return null;
+}