Add defaultUsername option

src/components/App.js

@@ -60,7 +60,7 @@ class App extends Component {
       if (options.timeToClose > 0) {
         const delay = options.timeToClose * 60 * 1000;
         this.disconnectingEvent = setTimeout(
-          () => this.props.dispatch(AppUIActions.disconnectUser()),
+          () => window.location.reload(),
           delay
         );
       }

src/components/Sidebar.js

@@ -1,12 +1,10 @@
-import React, { useCallback } from 'react';
-import { useSelector, useDispatch } from 'react-redux';
+import React from 'react';
+import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
 import { Link } from 'react-router-dom';
 import { NavLink } from 'react-router-dom';
 import moment from 'moment';
 
-import { disconnectUser } from 'slices/AppUISlice';
-
 import secretin from 'utils/secretin';
 import Icon from 'components/utilities/Icon';
 
@@ -57,10 +55,6 @@ function exportDb() {
 }
 
 function Sidebar() {
-  const dispatch = useDispatch();
-  const handleLogout = useCallback(() => {
-    dispatch(disconnectUser());
-  }, [dispatch]);
   const currentUser = useSelector(state => state.AppUI.currentUser);
   const isOnline = useSelector(state => state.AppUI.online);
   return (
@@ -113,7 +107,10 @@ function Sidebar() {
           </SidebarMenuLink>
           <div className="sidebar-separator" />
           <li className="sidebar-menu-item">
-            <a className="sidebar-menu-link" onClick={handleLogout}>
+            <a
+              className="sidebar-menu-link"
+              onClick={() => window.location.reload()}
+            >
               <Icon id="logout" size="base" />
               Log out
             </a>

src/components/options/OptionsContainer.js

@@ -25,6 +25,15 @@ class OptionsContainer extends Component {
   constructor(props) {
     super(props);
     this.onChangeTimeToClose = this.onChangeTimeToClose.bind(this);
+    this.onChangeDefaultUsername = this.onChangeDefaultUsername.bind(this);
+    this.onSaveDefaultUsername = this.onSaveDefaultUsername.bind(this);
+    this.state = {
+      defaultUsername: props.options.defaultUsername,
+    };
+  }
+
+  onChangeDefaultUsername({ value }) {
+    this.setState({ defaultUsername: value });
   }
 
   onChangeTimeToClose({ value }) {
@@ -33,8 +42,18 @@ class OptionsContainer extends Component {
     });
   }
 
+  onSaveDefaultUsername() {
+    this.props.actions.changeDefaultUsername({
+      defaultUsername: this.state.defaultUsername,
+    });
+  }
+
   render() {
-    const { options, isOnline } = this.props;
+    const {
+      options,
+      isOnline,
+      options: { defaultUsername = '' },
+    } = this.props;
     return (
       <div className="page">
         <div className="page-header">
@@ -44,6 +63,37 @@ class OptionsContainer extends Component {
         </div>
 
         <div className="page-content options">
+          <div className="options-section">
+            <h3 className="options-section-title">Experience</h3>
+            <div className="options-section-item">
+              <Input
+                name="defaultUsername"
+                label="Default username"
+                size="small"
+                value={this.state.defaultUsername}
+                onChange={this.onChangeDefaultUsername}
+                disabled={!isOnline}
+              />
+              <div className="options-section-subitem-save">
+                <Button
+                  type="button"
+                  buttonStyle={
+                    this.state.defaultUsername === defaultUsername
+                      ? 'default'
+                      : 'primary'
+                  }
+                  onClick={this.onSaveDefaultUsername}
+                  size="small"
+                  disabled={
+                    !isOnline || this.state.defaultUsername === defaultUsername
+                  }
+                >
+                  Save
+                </Button>
+              </div>
+            </div>
+          </div>
+
           <div className="options-section">
             <h3 className="options-section-title">Security</h3>
 

src/models/SecretDataRecord.js

@@ -1,5 +1,4 @@
 import SecretFieldRecord from 'models/SecretFieldRecord';
-import { Utils } from 'secretin';
 
 class SecretDataRecord {
   constructor(raw = {}) {
@@ -22,12 +21,6 @@ class SecretDataRecord {
 
   static createWithDefaultFields(defaultFields) {
     return defaultFields.reduce((record, field) => {
-      if (field.type === 'password') {
-        return record.addNewField({
-          ...field,
-          content: Utils.PasswordGenerator.generatePassword(),
-        });
-      }
       return record.addNewField(field);
     }, new SecretDataRecord());
   }

src/slices/AppUISlice.js

@@ -120,8 +120,7 @@ export const {
 } = AppUISlice.actions;
 
 export const disconnectUser = () => dispatch => {
-  secretin.currentUser.disconnect();
-  dispatch(disconnectUserSuccess());
+  window.location.reload();
 };
 
 export const createUser = ({

src/slices/EditSecretUISlice.js

@@ -3,13 +3,18 @@ import { createSlice } from '@reduxjs/toolkit';
 import { showSecretSuccess } from 'slices/ShowSecretUISlice';
 import { hideModal } from 'slices/ShowSecretUISlice';
 import { updateSecretSuccess } from 'slices/MetadataSlice';
+import { disconnectUserSuccess } from 'slices/AppUISlice';
 
-export const EditSecretUISlice = createSlice({
-  name: 'EditSecretUI',
-  initialState: {
+function getInitialState() {
+  return {
     isEditing: false,
     data: null,
-  },
+  };
+}
+
+export const EditSecretUISlice = createSlice({
+  name: 'EditSecretUI',
+  initialState: getInitialState(),
   reducers: {
     updateData: (state, action) => {
       state.isEditing = false;
@@ -36,6 +41,7 @@ export const EditSecretUISlice = createSlice({
     [updateSecretSuccess]: state => {
       state.isEditing = false;
     },
+    [disconnectUserSuccess]: getInitialState,
   },
 });
 

src/slices/ImportSlice.js

@@ -1,6 +1,7 @@
 import { createSlice } from '@reduxjs/toolkit';
 import importers from 'utils/importers';
 import { findKey } from 'lodash';
+import { disconnectUserSuccess } from 'slices/AppUISlice';
 
 const getInitialState = () => ({
   importType: '',
@@ -80,6 +81,9 @@ export const ImportSlice = createSlice({
       state.mandatoryFields[field.name].value = value;
     },
   },
+  extraReducers: {
+    [disconnectUserSuccess]: getInitialState,
+  },
 });
 
 // Action creators are generated for each case reducer function

src/slices/MetadataSlice.js

@@ -1,6 +1,7 @@
 import secretin, { Errors } from 'utils/secretin';
 import { createSlice } from '@reduxjs/toolkit';
 import Secret from 'models/Secret';
+import { disconnectUserSuccess } from 'slices/AppUISlice';
 
 import {
   createSecretSuccess,
@@ -43,11 +44,15 @@ const _rebuildMetadata = (state, action) => {
   state.knownFriendList = Array.from(friendList).sort();
 };
 
+function getInitialState() {
+  return {
+    metadata: [],
+  };
+}
+
 export const MetadataSlice = createSlice({
   name: 'Metadata',
-  initialState: {
-    metadata: [],
-  },
+  initialState: getInitialState(),
   reducers: {
     loadMetadataSuccess: _rebuildMetadata,
     deleteSecretSuccess: _rebuildMetadata,
@@ -82,6 +87,7 @@ export const MetadataSlice = createSlice({
   extraReducers: {
     [createSecretSuccess]: _rebuildMetadata,
     [loginUserSuccess]: _rebuildMetadata,
+    [disconnectUserSuccess]: getInitialState,
   },
 });
 

src/slices/NewSecretUISlice.js

@@ -1,7 +1,9 @@
 import { createSlice } from '@reduxjs/toolkit';
 import SecretDataRecord from 'models/SecretDataRecord';
 
-import { createSecretSuccess } from 'slices/AppUISlice';
+import { createSecretSuccess, disconnectUserSuccess } from 'slices/AppUISlice';
+import secretin from 'utils/secretin';
+import { Utils } from 'secretin';
 
 const getInitialState = () => ({
   shown: false,
@@ -23,6 +25,17 @@ export const NewSecretUISlice = createSlice({
       state.title = `Untitled ${isFolder ? 'folder' : 'secret'}`;
       state.folder = folder;
       state.isFolder = isFolder;
+      const loginIndex = state.data.fields.findIndex(
+        fieldToUpdate => fieldToUpdate.label === 'login'
+      );
+      const passwordIndex = state.data.fields.findIndex(
+        fieldToUpdate => fieldToUpdate.label === 'password'
+      );
+      state.data.fields[loginIndex].content =
+        secretin.currentUser.options?.defaultUsername ?? '';
+      state.data.fields[
+        passwordIndex
+      ].content = Utils.PasswordGenerator.generatePassword();
     },
     hideModal: () => getInitialState(),
     changeTitle: (state, action) => {
@@ -38,7 +51,8 @@ export const NewSecretUISlice = createSlice({
     },
   },
   extraReducers: {
-    [createSecretSuccess]: () => getInitialState(),
+    [createSecretSuccess]: getInitialState,
+    [disconnectUserSuccess]: getInitialState,
   },
 });
 

src/slices/OptionsSlice.js

@@ -2,7 +2,11 @@ import { createSlice } from '@reduxjs/toolkit';
 import secretin from 'utils/secretin';
 import uuid from 'uuid';
 
-import { loginUserSuccess } from 'slices/AppUISlice';
+import {
+  loginUserSuccess,
+  createUserSuccess,
+  disconnectUserSuccess,
+} from 'slices/AppUISlice';
 
 const getInitialState = () => ({
   options: {},
@@ -91,6 +95,11 @@ export const OptionsSlice = createSlice({
       state.options.timeToClose = timeToClose;
     },
 
+    changeDefaultUsernameSuccess: (state, action) => {
+      const { defaultUsername } = action.payload;
+      state.options.defaultUsername = defaultUsername;
+    },
+
     changeNewPass1: (state, action) => {
       const newPass1 = action.payload;
       state.newPass.newPass1 = newPass1.value;
@@ -152,6 +161,8 @@ export const OptionsSlice = createSlice({
       const { options } = action.payload;
       state.options = options;
     },
+    [createUserSuccess]: getInitialState,
+    [disconnectUserSuccess]: getInitialState,
   },
 });
 
@@ -169,6 +180,7 @@ export const {
   deactivateShortLoginSuccess,
   activateShortLoginSuccess,
   changeDelaySuccess,
+  changeDefaultUsernameSuccess,
   changeNewPass1,
   changeNewPass2,
   showChangePassword,
@@ -282,6 +294,22 @@ export const toggleAutoLogout = ({ checked }) => (dispatch, getState) => {
   return dispatch(changeTimeToClose({ timeToClose: delay }));
 };
 
+export const changeDefaultUsername = ({ defaultUsername }) => (
+  dispatch,
+  getState
+) => {
+  secretin
+    .editOption('defaultUsername', defaultUsername)
+    .then(() => {
+      dispatch(changeDefaultUsernameSuccess({ defaultUsername }));
+    })
+    .catch(() => {
+      // Currently the UI can't display this error anyway
+      // dispatch(changeDelayFailure());
+    });
+  return true;
+};
+
 export const changeTimeToClose = ({ timeToClose }) => (dispatch, getState) => {
   secretin
     .editOption('timeToClose', timeToClose)

src/slices/ShowSecretUISlice.js

@@ -10,6 +10,8 @@ import {
   deleteSecretUserRightsSuccess,
 } from 'slices/MetadataSlice';
 
+import { disconnectUserSuccess } from 'slices/AppUISlice';
+
 const getInitialState = () => ({
   secret: null,
   errors: {},
@@ -101,6 +103,7 @@ export const ShowSecretUISlice = createSlice({
       state.isUpdating = false;
       state.errors = {};
     },
+    [disconnectUserSuccess]: getInitialState,
   },
 });
 

src/stylesheets/components/options/OptionsContainer.sass

@@ -13,3 +13,6 @@
 .options-section-subitem
   margin: 0 0 20px
   padding-left: 32px
+
+.options-section-subitem-save
+  margin: 10px 0 20px