diff --git a/client/package-lock.json b/client/package-lock.json
index 21f6775b125..b046fc6f4c2 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -19355,9 +19355,9 @@
       "optional": true
     },
     "nanoid": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-1.3.4.tgz",
-      "integrity": "sha512-4ug4BsuHxiVHoRUe1ud6rUFT3WUMmjXt1W0quL0CviZQANdan7D8kqN5/maw53hmAApY/jfzMRkC57BNNs60ZQ=="
+      "version": "3.1.12",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.12.tgz",
+      "integrity": "sha512-1qstj9z5+x491jfiC4Nelk+f8XBad7LN20PmyWINJEMRSf3wcAjAWysw1qaA8z6NSKe2sjq1hRSDpBH5paCb6A=="
     },
     "nanomatch": {
       "version": "1.2.13",
diff --git a/client/package.json b/client/package.json
index c2a0b470318..f072edc026a 100644
--- a/client/package.json
+++ b/client/package.json
@@ -47,7 +47,7 @@
     "jquery": "^3.5.1",
     "lodash": "^4.17.20",
     "monaco-editor": "^0.20.0",
-    "nanoid": "^1.2.2",
+    "nanoid": "^3.1.12",
     "prismjs": "^1.22.0",
     "query-string": "^6.13.5",
     "react": "^16.10.2",
diff --git a/client/src/components/Flash/redux/index.js b/client/src/components/Flash/redux/index.js
index 69da6981c50..74d69fe4305 100644
--- a/client/src/components/Flash/redux/index.js
+++ b/client/src/components/Flash/redux/index.js
@@ -1,5 +1,5 @@
 import { createAction, handleActions } from 'redux-actions';
-import nanoId from 'nanoid';
+import { nanoid } from 'nanoid';
 
 import { createTypes } from '../../../utils/createTypes';
 
@@ -15,7 +15,7 @@ export const sagas = [];
 
 export const createFlashMessage = createAction(
   types.createFlashMessage,
-  msg => ({ id: nanoId(), ...msg })
+  msg => ({ id: nanoid(), ...msg })
 );
 export const removeFlashMessage = createAction(types.removeFlashMessage);
 
diff --git a/client/src/components/settings/Portfolio.js b/client/src/components/settings/Portfolio.js
index 322573ba932..2693c2d2256 100644
--- a/client/src/components/settings/Portfolio.js
+++ b/client/src/components/settings/Portfolio.js
@@ -1,6 +1,6 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
-import nanoid from 'nanoid';
+import { nanoid } from 'nanoid';
 import {
   Button,
   FormGroup,