diff --git a/package.json b/package.json
index 271dddf5f98dc3f68b57388a5f41e5c91c5c991b..7802ff8f90a158a9b167aaee9953f67fec5d5658 100644
--- a/package.json
+++ b/package.json
@@ -78,6 +78,7 @@
"object-hash": "^3.0.0",
"react": "16.14.0",
"react-dom": "16.14.0",
+ "react-inspector": "^5.1",
"react-redux": "^8.1.2",
"react-router-dom": "^6.6.1",
"react-swipeable-views": "0.14.0",
diff --git a/src/components/App.tsx b/src/components/App.tsx
index 548c4ff7290146453390c3f12da617cdee647601..7c4621ff74e7b5f7124b5b84ab84d7c001e6f744 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -3,6 +3,7 @@ import Navbar from 'components/Navbar/Navbar'
import AppRoutes from 'components/Routes/Routes'
import SplashRoot from 'components/Splash/SplashRoot'
import WelcomeModal from 'components/WelcomeModal/WelcomeModal'
+import CozyDevtools from 'cozy-client/dist/devtools'
import { useWebviewIntent } from 'cozy-intent'
import { Layout } from 'cozy-ui/transpiled/react/Layout'
import React, { useEffect } from 'react'
@@ -50,6 +51,7 @@ export const App = ({ tracker }: AppProps) => {
<AppRoutes termsStatus={termsStatus} />
</main>
</SplashRoot>
+ {process.env.NODE_ENV !== 'production' ? <CozyDevtools /> : null}
</ThemeProvider>
</Layout>
)
diff --git a/src/components/theme.ts b/src/components/theme.ts
index 30e729bed317f1b4a488faf6fe79d6c7044e2e4a..e23010af8bab6529a2e279be850241191d9559f1 100644
--- a/src/components/theme.ts
+++ b/src/components/theme.ts
@@ -3,6 +3,9 @@ import { createTheme } from '@material-ui/core'
export const theme = createTheme({
palette: {
type: 'dark',
+ primary: {
+ '500': '#579eff',
+ },
},
overrides: {
MuiButton: {
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 7fbd19f81687d01707b1afb820851bcef6128105..0539cbb69643b6e28d1e5366ebd1b0f0aac7439f 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -76,3 +76,12 @@
// useful when text is rendered with loader
align-items: center;
}
+
+// devtools button
+.makeStyles-fab-1 {
+ top: 12px;
+ left: 3rem !important;
+ width: 36px !important;
+ height: 36px !important;
+ background-color: $dark-light-3 !important;
+}
diff --git a/src/types/cozy-client/dist/devtools.d.ts b/src/types/cozy-client/dist/devtools.d.ts
new file mode 100644
index 0000000000000000000000000000000000000000..402492edb2d18683d4b9964102bd7eb5d582c782
--- /dev/null
+++ b/src/types/cozy-client/dist/devtools.d.ts
@@ -0,0 +1 @@
+declare module 'cozy-client/dist/devtools'
diff --git a/yarn.lock b/yarn.lock
index e75dcc6ce46a1b1e2029c919d31b8f132414ff46..d7a38cd0900618b42e372aac25d5b3a854bc01e7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10395,6 +10395,14 @@ is-docker@^3.0.0:
resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-3.0.0.tgz#90093aa3106277d8a77a5910dbae71747e15a200"
integrity sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==
+is-dom@^1.0.0:
+ version "1.1.0"
+ resolved "https://registry.yarnpkg.com/is-dom/-/is-dom-1.1.0.tgz#af1fced292742443bb59ca3f76ab5e80907b4e8a"
+ integrity sha512-u82f6mvhYxRPKpw8V1N0W8ce1xXwOrQtgGcxl6UCL5zBmZu3is/18K0rR7uFCnMDuAsS/3W54mGL4vsaFUQlEQ==
+ dependencies:
+ is-object "^1.0.1"
+ is-window "^1.0.2"
+
is-extendable@^0.1.0, is-extendable@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
@@ -10518,6 +10526,11 @@ is-obj@^2.0.0:
resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-2.0.0.tgz#473fb05d973705e3fd9620545018ca8e22ef4982"
integrity sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==
+is-object@^1.0.1:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/is-object/-/is-object-1.0.2.tgz#a56552e1c665c9e950b4a025461da87e72f86fcf"
+ integrity sha512-2rRIahhZr2UWb45fIOuvZGpFtz0TyOZLf32KxBbSoUCeZR495zCKlWUKKUByk3geS2eAs7ZAABt0Y/Rx0GiQGA==
+
is-path-cwd@^2.0.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/is-path-cwd/-/is-path-cwd-2.2.0.tgz#67d43b82664a7b5191fd9119127eb300048a9fdb"
@@ -10683,6 +10696,11 @@ is-whitespace@^0.3.0:
resolved "https://registry.yarnpkg.com/is-whitespace/-/is-whitespace-0.3.0.tgz#1639ecb1be036aec69a54cbb401cfbed7114ab7f"
integrity sha512-RydPhl4S6JwAyj0JJjshWJEFG6hNye3pZFBRZaTUfZFwGHxzppNaNOVgQuS/E/SlhrApuMXrpnK1EEIXfdo3Dg==
+is-window@^1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/is-window/-/is-window-1.0.2.tgz#2c896ca53db97de45d3c33133a65d8c9f563480d"
+ integrity sha512-uj00kdXyZb9t9RcAUAwMZAnkBUwdYGhYlt7djMXhfyhUCzwNba50tIiBKR7q0l7tdoBtFVw/3JmLY6fI3rmZmg==
+
is-windows@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-1.0.2.tgz#d1850eb9791ecd18e6182ce12a30f396634bb19d"
@@ -14458,7 +14476,7 @@ prop-types@15.7.2:
object-assign "^4.1.1"
react-is "^16.8.1"
-prop-types@^15.5.4, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:
+prop-types@^15.0.0, prop-types@^15.5.4, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:
version "15.8.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -14743,6 +14761,15 @@ react-input-autosize@^3.0.0:
dependencies:
prop-types "^15.5.8"
+react-inspector@^5.1:
+ version "5.1.1"
+ resolved "https://registry.yarnpkg.com/react-inspector/-/react-inspector-5.1.1.tgz#58476c78fde05d5055646ed8ec02030af42953c8"
+ integrity sha512-GURDaYzoLbW8pMGXwYPDBIv6nqei4kK7LPRZ9q9HCZF54wqXz/dnylBp/kfE9XmekBhHvLDdcYeyIwSrvtOiWg==
+ dependencies:
+ "@babel/runtime" "^7.0.0"
+ is-dom "^1.0.0"
+ prop-types "^15.0.0"
+
react-is@^16.12.0, react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"