Fix some things with multibot login

src/components/BotList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div v-if="botCount > 0">
     <h3 v-if="!small">Available bots</h3>
     <b-list-group>
       <b-list-group-item
@@ -31,6 +31,8 @@ const ftbot = namespace('ftbot');
 export default class BotList extends Vue {
   @Prop({ default: false, type: Boolean }) small!: boolean;
 
+  @ftbot.Getter [MultiBotStoreGetters.botCount]: number;
+
   @ftbot.Getter [MultiBotStoreGetters.selectedBot]: string;
 
   @ftbot.Getter [MultiBotStoreGetters.allIsBotOnline]: Record<string, boolean>;

src/components/Login.vue

@@ -5,7 +5,6 @@
         <b-form-input
           id="name-input"
           v-model="auth.botName"
-          required
           placeholder="Bot Name"
           @keydown.enter.native="handleOk"
         ></b-form-input>
@@ -85,9 +84,14 @@ export default class Login extends Vue {
 
   @ftbot.Getter [MultiBotStoreGetters.nextBotId]: string;
 
+  @ftbot.Getter [MultiBotStoreGetters.selectedBot]: string;
+
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   @ftbot.Action addBot!: (payload: BotDescriptor) => void;
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  @ftbot.Action selectBot!: (botId: string) => void;
+
   @Prop({ default: false }) inModal!: boolean;
 
   $refs!: {
@@ -149,13 +153,16 @@ export default class Login extends Vue {
     userService
       .login(this.auth)
       .then(() => {
+        const botId = this.nextBotId;
         this.addBot({
           botName: this.auth.botName,
-          botId: this.nextBotId,
+          botId,
           botUrl: this.auth.url,
         });
-        // TODO: Investigate how this needs to be done properly
-        // setBaseUrl(userService.getAPIUrl());
+        if (this.selectedBot === '') {
+          console.log(`selecting bot ${botId}`);
+          this.selectBot(botId);
+        }
 
         this.emitLoginResult(true);
         if (this.inModal === false) {

src/components/layout/NavBar.vue

@@ -90,8 +90,8 @@
                 <b-checkbox v-model="layoutLockedLocal" class="ml-2"> Lock layout</b-checkbox>
               </div>
 
-              <nav-item class="nav-link navbar-nav" @click="resetDynamicLayout"
-                >Reset Layout</nav-item
+              <b-nav-item class="nav-link navbar-nav" @click="resetDynamicLayout"
+                >Reset Layout</b-nav-item
               >
               <router-link
                 v-if="botCount === 1"

src/views/LoginModal.vue

@@ -2,7 +2,7 @@
   <div>
     <b-button v-b-modal.modal-prevent-closing>{{ loginText }}</b-button>
     <b-modal id="modal-prevent-closing" ref="modal" title="Login to your bot" @ok="handleOk">
-      <Login id="loginForm" ref="loginForm" in-modal />
+      <Login id="loginForm" ref="loginForm" in-modal @loginResult="handleLoginResult" />
     </b-modal>
   </div>
 </template>
@@ -18,6 +18,7 @@ import Login from '@/components/Login.vue';
 export default class LoginModal extends Vue {
   $refs!: {
     loginForm: HTMLFormElement;
+    modal: HTMLElement;
   };
 
   @Prop({ required: false, default: 'Login', type: String }) loginText!: string;
@@ -26,6 +27,12 @@ export default class LoginModal extends Vue {
     // this.$refs.loginForm.resetLogin();
   }
 
+  handleLoginResult(result: boolean) {
+    if (result) {
+      (this.$refs.modal as any).hide();
+    }
+  }
+
   handleOk(evt) {
     evt.preventDefault();
     this.$refs.loginForm.handleSubmit();