move dev button and new tab page default

core/src/components/settings-view/security-view.js

@@ -1,7 +1,7 @@
 import { LitElement, html, css } from 'lit'
 import { connect } from 'pwa-helpers'
 import { store } from '../../store.js'
-import { allowQAPPAutoAuth, removeQAPPAutoAuth, removeQAPPAutoLists, allowQAPPAutoLists } from '../../redux/app/app-actions.js'
+import { allowQAPPAutoAuth, removeQAPPAutoAuth, removeQAPPAutoLists, allowQAPPAutoLists, setIsOpenDevDialog } from '../../redux/app/app-actions.js'
 import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
 import snackbar from '../../functional-components/snackbar.js'
 import FileSaver from 'file-saver'
@@ -15,7 +15,8 @@ class SecurityView extends connect(store)(LitElement) {
     static get properties() {
         return {
             theme: { type: String, reflect: true },
-            backupErrorMessage: { type: String }
+            backupErrorMessage: { type: String },
+            closeSettings: {attribute: false}
         }
     }
 
@@ -75,6 +76,23 @@ class SecurityView extends connect(store)(LitElement) {
                 transition: all .2s;
                 position: relative;
             }   
+
+            .add-dev-button {
+                margin-top: 4px;
+                max-height: 28px;
+                padding: 5px 5px;
+                font-size: 14px;
+                background-color: #03a9f4;
+                color: white;
+                border: 1px solid transparent;
+                border-radius: 3px;
+                cursor: pointer;
+            }
+
+            .add-dev-button:hover {
+                opacity: 0.8;
+                cursor: pointer;
+            }
         `
     }
 
@@ -122,6 +140,14 @@ class SecurityView extends connect(store)(LitElement) {
                             </label>
                             <mwc-checkbox style="margin-right: -15px;" id="authButton" @click=${(e) => this.checkForLists(e)} ?checked=${store.getState().app.qAPPAutoLists}></mwc-checkbox>
                     </div>
+                    <div class="checkbox-row">
+                    <button 
+                    class="add-dev-button"
+                    title="${translate('tabmenu.tm18')}"
+                    @click=${this.openDevDialog}
+                >${translate('tabmenu.tm38')}</button>
+                    </div>
+                    
                 </div>
         `
     }
@@ -155,6 +181,11 @@ class SecurityView extends connect(store)(LitElement) {
         }
     }
 
+    openDevDialog() {
+        this.closeSettings()
+        store.dispatch(setIsOpenDevDialog(true))
+    }
+
     async downloadBackup() {
         let backupname = ''
         this.backupErrorMessage = ''

core/src/components/settings-view/user-settings.js

@@ -157,7 +157,9 @@ class UserSettings extends connect(store)(LitElement) {
                 font-size: 16px;
                 text-align: center;
                 min-height: 460px;
-                height: 60vh;
+                height: auto;
+                overflow: auto;
+
             }
 
             @media(max-width:700px) {
@@ -252,7 +254,7 @@ class UserSettings extends connect(store)(LitElement) {
         if (selectedView.id === 'info') {
             return html`<account-view></account-view>`
         } else if (selectedView.id === 'security') {
-            return html`<security-view></security-view>`
+            return html`<security-view .closeSettings=${()=> this.closeSettings()}></security-view>`
         } else if (selectedView.id === 'export') {
             return html`<export-keys></export-keys>`
         } else if (selectedView.id === 'notification') {

core/src/components/show-plugin.js

@@ -6,7 +6,7 @@ import { Epml } from '../epml.js'
 import { addPluginRoutes } from '../plugins/addPluginRoutes.js'
 import { repeat } from 'lit/directives/repeat.js';
 import ShortUniqueId from 'short-unique-id';
-import { setNewTab } from '../redux/app/app-actions.js'
+import { setIsOpenDevDialog, setNewTab } from '../redux/app/app-actions.js'
 import localForage from 'localforage'
 import FileSaver from 'file-saver'
 import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
@@ -46,7 +46,8 @@ class ShowPlugin extends connect(store)(LitElement) {
             tabInfo: { type: Object },
             chatLastSeen: { type: Array },
             chatHeads: { type: Array },
-            proxyPort: { type: Number }
+            proxyPort: { type: Number },
+            isOpenDevDialog: {type: Boolean}
         }
     }
 
@@ -334,9 +335,11 @@ class ShowPlugin extends connect(store)(LitElement) {
         this.chatLastSeen = []
         this.chatHeads = []
         this.proxyPort = 0
+        this.isOpenDevDialog = false
     }
 
     render() {
+        
         const plugSrc = (myPlug) => {
             return myPlug === undefined ? 'about:blank' : `${window.location.origin}/plugin/${myPlug.domain}/${myPlug.page}${this.linkParam}`
         }
@@ -459,11 +462,6 @@ class ShowPlugin extends connect(store)(LitElement) {
                         this.currentTab = lengthOfTabs
                     }}
                 >+</button>
-                <button 
-                    class="add-dev-button"
-                    title="${translate('tabmenu.tm18')}"
-                    @click=${this.openDevDialog}
-                >${translate('tabmenu.tm38')}</button>
             </div>
 
             ${repeat(this.tabs, (tab) => tab.id, (tab, index) => html`
@@ -485,7 +483,15 @@ class ShowPlugin extends connect(store)(LitElement) {
                     </nav-bar>
                 </div>
             `)}
-            <mwc-dialog id="addDevDialog">
+            <mwc-dialog id="addDevDialog"  
+                ?open=${this.isOpenDevDialog} 
+                @closed=${() => {
+                  this.shadowRoot.getElementById('domainInput').value = ''
+        this.shadowRoot.getElementById('portInput').value = ''
+        this.isOpenDevDialog = false
+        store.dispatch(setIsOpenDevDialog(false))
+            }}
+                >
                 <div style="text-align: center;">
                     <h2>${translate('tabmenu.tm39')}</h2>
                     <hr>
@@ -552,12 +558,6 @@ class ShowPlugin extends connect(store)(LitElement) {
         return true
     }
 
-    openDevDialog() {
-        this.shadowRoot.getElementById('domainInput').value = ''
-        this.shadowRoot.getElementById('portInput').value = ''
-        this.shadowRoot.querySelector("#addDevDialog").show()
-    }
-
     async getProxyPort() {
         this.proxyPort = 0
         let framework = ''
@@ -734,11 +734,9 @@ class ShowPlugin extends connect(store)(LitElement) {
             const myPlugObj = plugArr.find(pagePlug => {
                 return pagePlug.url === this.url
             })
-
             if (this.tabs.length === 0) {
                 this.addTab({
-                    url: this.url,
-                    myPlugObj,
+                    url: "",
                     id: this.uid()
                 })
             } else {
@@ -781,7 +779,7 @@ class ShowPlugin extends connect(store)(LitElement) {
         }
 
         if (split[0] === '' && split[1] === 'app' && split[2] === undefined) {
-            newUrl = 'wallet'
+            newUrl = ''
             newLinkParam = ''
         } else if (split.length === 5 && split[1] === 'app') {
             newUrl = split[2]
@@ -793,7 +791,6 @@ class ShowPlugin extends connect(store)(LitElement) {
             newUrl = '404'
             newLinkParam = ''
         }
-
         if (newUrl !== this.url) {
             this.url = newUrl
         }
@@ -839,6 +836,9 @@ class ShowPlugin extends connect(store)(LitElement) {
                 //clear newTab
             }
         }
+        if(state.app.isOpenDevDialog){
+            this.isOpenDevDialog = state.app.isOpenDevDialog
+        }
     }
 }
 

core/src/redux/app/actions/app-core.js

@@ -1,5 +1,5 @@
 // Core App Actions here...
-import { UPDATE_BLOCK_INFO, UPDATE_NODE_STATUS, UPDATE_NODE_INFO, CHAT_HEADS, ACCOUNT_INFO, ADD_AUTO_LOAD_IMAGES_CHAT, REMOVE_AUTO_LOAD_IMAGES_CHAT, ALLOW_QAPP_AUTO_AUTH, REMOVE_QAPP_AUTO_AUTH, SET_CHAT_LAST_SEEN, ADD_CHAT_LAST_SEEN, ALLOW_QAPP_AUTO_LISTS, REMOVE_QAPP_AUTO_LISTS, SET_NEW_TAB, ADD_TAB_INFO, SET_TAB_NOTIFICATIONS } from '../app-action-types.js'
+import { UPDATE_BLOCK_INFO, UPDATE_NODE_STATUS, UPDATE_NODE_INFO, CHAT_HEADS, ACCOUNT_INFO, ADD_AUTO_LOAD_IMAGES_CHAT, REMOVE_AUTO_LOAD_IMAGES_CHAT, ALLOW_QAPP_AUTO_AUTH, REMOVE_QAPP_AUTO_AUTH, SET_CHAT_LAST_SEEN, ADD_CHAT_LAST_SEEN, ALLOW_QAPP_AUTO_LISTS, REMOVE_QAPP_AUTO_LISTS, SET_NEW_TAB, ADD_TAB_INFO, SET_TAB_NOTIFICATIONS, IS_OPEN_DEV_DIALOG } from '../app-action-types.js'
 
 export const doUpdateBlockInfo = (blockObj) => {
     return (dispatch, getState) => {
@@ -126,7 +126,12 @@ export const setNewTab = (payload) => {
         payload
     }
 }
-
+export const setIsOpenDevDialog = (payload)=> {
+    return {
+        type: IS_OPEN_DEV_DIALOG,
+        payload
+    }
+}
 export const addTabInfo = (payload) => {
     return {
         type: ADD_TAB_INFO,

core/src/redux/app/app-action-types.js

@@ -27,4 +27,5 @@ export const SET_CHAT_LAST_SEEN = 'SET_CHAT_LAST_SEEN'
 export const ADD_CHAT_LAST_SEEN = 'ADD_CHAT_LAST_SEEN'
 export const SET_NEW_TAB = 'SET_NEW_TAB'
 export const ADD_TAB_INFO = 'ADD_TAB_INFO'
-export const SET_TAB_NOTIFICATIONS = 'SET_TAB_NOTIFICATIONS'
+export const SET_TAB_NOTIFICATIONS = 'SET_TAB_NOTIFICATIONS'
+export const IS_OPEN_DEV_DIALOG = 'IS_OPEN_DEV_DIALOG'

core/src/redux/app/app-reducer.js

@@ -1,6 +1,6 @@
 // Loading state, login state, isNavDrawOpen state etc. None of this needs to be saved to localstorage.
 import { loadStateFromLocalStorage, saveStateToLocalStorage } from '../../localStorageHelpers.js'
-import { LOG_IN, LOG_OUT, NETWORK_CONNECTION_STATUS, INIT_WORKERS, ADD_PLUGIN_URL, ADD_PLUGIN, ADD_NEW_PLUGIN_URL, NAVIGATE, SELECT_ADDRESS, ACCOUNT_INFO, CHAT_HEADS, UPDATE_BLOCK_INFO, UPDATE_NODE_STATUS, UPDATE_NODE_INFO, LOAD_NODE_CONFIG, SET_NODE, ADD_NODE, PAGE_URL, ADD_AUTO_LOAD_IMAGES_CHAT, REMOVE_AUTO_LOAD_IMAGES_CHAT, ALLOW_QAPP_AUTO_AUTH, REMOVE_QAPP_AUTO_AUTH, SET_CHAT_LAST_SEEN, ADD_CHAT_LAST_SEEN, ALLOW_QAPP_AUTO_LISTS, REMOVE_QAPP_AUTO_LISTS, SET_NEW_TAB, ADD_TAB_INFO, SET_TAB_NOTIFICATIONS } from './app-action-types.js'
+import { LOG_IN, LOG_OUT, NETWORK_CONNECTION_STATUS, INIT_WORKERS, ADD_PLUGIN_URL, ADD_PLUGIN, ADD_NEW_PLUGIN_URL, NAVIGATE, SELECT_ADDRESS, ACCOUNT_INFO, CHAT_HEADS, UPDATE_BLOCK_INFO, UPDATE_NODE_STATUS, UPDATE_NODE_INFO, LOAD_NODE_CONFIG, SET_NODE, ADD_NODE, PAGE_URL, ADD_AUTO_LOAD_IMAGES_CHAT, REMOVE_AUTO_LOAD_IMAGES_CHAT, ALLOW_QAPP_AUTO_AUTH, REMOVE_QAPP_AUTO_AUTH, SET_CHAT_LAST_SEEN, ADD_CHAT_LAST_SEEN, ALLOW_QAPP_AUTO_LISTS, REMOVE_QAPP_AUTO_LISTS, SET_NEW_TAB, ADD_TAB_INFO, SET_TAB_NOTIFICATIONS, IS_OPEN_DEV_DIALOG } from './app-action-types.js'
 import { initWorkersReducer } from './reducers/init-workers.js'
 import { loginReducer } from './reducers/login-reducer.js'
 import { setNode, addNode } from './reducers/manage-node.js'
@@ -49,7 +49,8 @@ const INITIAL_STATE = {
     qAPPAutoLists: loadStateFromLocalStorage('qAPPAutoLists') || false,
     chatLastSeen: [],
     newTab: null,
-    tabInfo: {}
+    tabInfo: {},
+    isOpenDevDialog: false
 }
 
 export default (state = INITIAL_STATE, action) => {
@@ -231,6 +232,12 @@ export default (state = INITIAL_STATE, action) => {
                 newTab: action.payload
             }
         }
+        case IS_OPEN_DEV_DIALOG: {
+            return {
+                ...state,
+                isOpenDevDialog: action.payload
+            }
+        }
         case ADD_TAB_INFO: {
             const newTabInfo = action.payload
             if (state.tabInfo[newTabInfo.id] && state.tabInfo[newTabInfo.id].name && newTabInfo.name === state.tabInfo[newTabInfo.id].name) break