Update Vue example app

[csmeyns]

This change updates the Vue example app as follows:

• Simplifies the creation of the current user, in line with how we currently do this in other getting started examples.
• Renames the chat component to Chat.vue (was: Inbox.vue), as a more neutral name. It also uses the chatbox rather than the inbox for the example.
• Use Vue's onMounted to make sure the component is mounted first.
• Updates the import of the chat in App.vue. The current user is no longer specified in App.vue, but instead in Chat.vue, as is the case in other getting started examples.

[csmeyns]

I can see the following other Vue-related changes:

* `<script>` to `<script setup>`

* `this.$refs.talkjs` to `document.getElementById('talkjs-container')`

Are these also Vue 3 things? I'm happy to go with them if so (don't have enough knowledge to judge either way)

I'm by no means an expert, but from what I understand:

1. Indeed from Vue 3 onward <script setup> can be used as a more concise way to define components, meaning that when using it you no longer need to specify:

export default {
  name: "Inbox",
  props: {
    currentUser: {
      type: Object,
      required: true,
    },
  },

2. As I understand it, the this.$refs.talkjs approach no longer works in combination with <script setup>. I then went back to the more traditional document.getElementById('talkjs-container') from the JS SDK, which is not Vue-specific but does work. However, i've dug in a bit and found another way to use Vue's ref that also works (combining this with Vue's nextTick to avoid mounting too soon). So will update the example with that change.

Thanks for spotting!

[csmeyns]

Update: Reverting the changes and will use the standard JS SDK approach after all (instead of ref and nextTick), in order to keep things straightforward (based on a DM conversation).