feat: init new i18n format

components/realtime/Mqtt.vue

@@ -55,7 +55,7 @@
       <AppSection label="messages">
         <div class="flex flex-col flex-1 p-4 inline-flex">
           <label for="pub_topic" class="font-semibold">
-            {{ $t("mqtt_topic") }}
+            {{ $t("mqtt.topic") }}
           </label>
         </div>
         <div class="flex px-4">
@@ -63,7 +63,7 @@
             id="pub_topic"
             v-model="pub_topic"
             class="input"
-            :placeholder="$t('topic_name')"
+            :placeholder="$t('mqtt.topic_name')"
             type="text"
             spellcheck="false"
           />
@@ -87,7 +87,7 @@
             name="get"
             class="rounded-l-none"
             :disabled="!canpublish"
-            :label="$t('mqtt_publish')"
+            :label="$t('mqtt.publish')"
             @click.native="publish"
           />
         </div>
@@ -101,7 +101,7 @@
           "
         >
           <label for="sub_topic" class="font-semibold">{{
-            $t("mqtt_topic")
+            $t("mqtt.topic")
           }}</label>
         </div>
         <div class="flex px-4">
@@ -109,7 +109,7 @@
             id="sub_topic"
             v-model="sub_topic"
             type="text"
-            :placeholder="$t('topic_name')"
+            :placeholder="$t('mqtt.topic_name')"
             spellcheck="false"
             class="input !rounded-r-none"
           />
@@ -119,7 +119,7 @@
             :disabled="!cansubscribe"
             class="rounded-l-none"
             :label="
-              subscriptionState ? $t('mqtt_unsubscribe') : $t('mqtt_subscribe')
+              subscriptionState ? $t('mqtt.unsubscribe') : $t('mqtt.subscribe')
             "
             reverse
             @click.native="toggleSubscription"

components/realtime/Socketio.vue

@@ -98,7 +98,7 @@
           <div class="flex">
             <ButtonSecondary
               v-tippy="{ theme: 'tooltip' }"
-              :title="$t('add_new')"
+              :title="$t('add.new')"
               icon="add"
               @click.native="addCommunicationInput"
             />
@@ -114,7 +114,7 @@
                 v-model="communication.inputs[index]"
                 class="input !rounded-r-none"
                 name="message"
-                :placeholder="$t('message_count', { count: index + 1 })"
+                :placeholder="$t('count.message', { count: index + 1 })"
                 type="text"
                 :disabled="!connectionState"
                 @keyup.enter="connectionState ? sendMessage() : null"

components/realtime/Websocket.vue

@@ -54,7 +54,7 @@
             "
           >
             <label class="font-semibold">
-              {{ $t("protocols") }}
+              {{ $t("websocket.protocols") }}
             </label>
             <div class="flex">
               <ButtonSecondary
@@ -65,7 +65,7 @@
               />
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
-                :title="$t('add_new')"
+                :title="$t('add.new')"
                 icon="add"
                 @click.native="addProtocol"
               />
@@ -92,7 +92,7 @@
                 px-4
                 focus:outline-none
               "
-              :placeholder="$t('protocol_count', { count: index + 1 })"
+              :placeholder="$t('count.protocol', { count: index + 1 })"
               name="message"
               type="text"
             />
@@ -102,9 +102,9 @@
                 :title="
                   protocol.hasOwnProperty('active')
                     ? protocol.active
-                      ? $t('turn_off')
-                      : $t('turn_on')
-                    : $t('turn_off')
+                      ? $t('action.turn_off')
+                      : $t('action.turn_on')
+                    : $t('action.turn_off')
                 "
                 :icon="
                   protocol.hasOwnProperty('active')
@@ -143,7 +143,7 @@
           >
             <i class="opacity-75 pb-2 material-icons">topic</i>
             <span class="text-center">
-              {{ $t("protocols_empty") }}
+              {{ $t("empty.protocols") }}
             </span>
           </div>
         </Pane>