Rename component, remove stupid console logs, make text box focus automatically

src/App.js

@@ -8,7 +8,7 @@ import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_pan
 import ChatPanel from './components/chat_panel/chat_panel.vue'
 import MediaModal from './components/media_modal/media_modal.vue'
 import SideDrawer from './components/side_drawer/side_drawer.vue'
-import NewStatusButton from './components/new_status_button/new_status_button.vue'
+import MobilePostStatusModal from './components/mobile_post_status_modal/mobile_post_status_modal.vue'
 import { unseenNotificationsFromStore } from './services/notification_utils/notification_utils'
 
 export default {
@@ -24,7 +24,7 @@ export default {
     ChatPanel,
     MediaModal,
     SideDrawer,
-    NewStatusButton
+    MobilePostStatusModal
   },
   data: () => ({
     mobileActivePanel: 'timeline',

src/App.vue

@@ -50,7 +50,7 @@
       <media-modal></media-modal>
     </div>
     <chat-panel :floating="true" v-if="currentUser && chat" class="floating-chat mobile-hidden"></chat-panel>
-    <NewStatusButton />
+    <MobilePostStatusModal />
   </div>
 </template>
 

src/components/mobile_post_status_modal/mobile_post_status_modal.js

@@ -1,7 +1,7 @@
 import PostStatusForm from '../post_status_form/post_status_form.vue'
 import { throttle } from 'lodash'
 
-const NewStatusButton = {
+const MobilePostStatusModal = {
   components: {
     PostStatusForm
   },
@@ -15,7 +15,6 @@ const NewStatusButton = {
     }
   },
   created () {
-    console.log('new-status-button')
     window.addEventListener('scroll', this.handleScroll)
   },
   destroyed () {
@@ -23,7 +22,6 @@ const NewStatusButton = {
   },
   computed: {
     currentUser () {
-      console.log(this.$store.state.users.currentUser)
       return this.$store.state.users.currentUser
     }
   },
@@ -31,6 +29,11 @@ const NewStatusButton = {
     openPostForm () {
       this.postFormOpen = true
       this.shown = false
+
+      const el = this.$el.querySelector('textarea')
+      this.$nextTick(function () {
+        el.focus()
+      })
     },
     closePostForm () {
       this.postFormOpen = false
@@ -59,4 +62,4 @@ const NewStatusButton = {
   }
 }
 
-export default NewStatusButton
+export default MobilePostStatusModal

src/components/mobile_post_status_modal/mobile_post_status_modal.vue

@@ -20,7 +20,7 @@
 </div>
 </template>
 
-<script src="./new_status_button.js"></script>
+<script src="./mobile_post_status_modal.js"></script>
 
 <style lang="scss">
 @import '../../_variables.scss';