refactor: rename index to stream (#45)

* rename index to stream

* refactor: add comma

web/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Zinc Oxide</title>
+    <title>Zinc Observe</title>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400;1,600;1,700&display=swap" rel="stylesheet">

web/src/components/logstream/schema.vue

@@ -4,7 +4,7 @@
       <div class="row items-center no-wrap">
         <div class="col">
           <div class="text-body1 text-bold text-dark">
-            {{ t("logindex.schemaHeader") }}
+            {{ t("logStream.schemaHeader") }}
           </div>
         </div>
         <div class="col-auto">
@@ -33,10 +33,10 @@
             <table class="q-table">
               <thead>
                 <tr>
-                  <th>{{ t("logindex.docsCount") }}</th>
-                  <th>{{ t("logindex.storageSize") }}</th>
-                  <th>{{ t("logindex.compressedSize") }}</th>
-                  <th>{{ t("logindex.time") }}</th>
+                  <th>{{ t("logStream.docsCount") }}</th>
+                  <th>{{ t("logStream.storageSize") }}</th>
+                  <th>{{ t("logStream.compressedSize") }}</th>
+                  <th>{{ t("logStream.time") }}</th>
                 </tr>
               </thead>
               <tbody>
@@ -72,7 +72,7 @@
 
           <q-separator class="q-mt-xl q-mb-lg" />
 
-          <div class="title">{{ t("logindex.mapping") }}</div>
+          <div class="title">{{ t("logStream.mapping") }}</div>
           <!-- Note: Drawer max-height to be dynamically calculated with JS -->
           <div
             class="q-table__container q-table--cell-separator"
@@ -81,10 +81,10 @@
             <table class="q-table">
               <thead>
                 <tr>
-                  <th>{{ t("logindex.propertyName") }}</th>
-                  <th>{{ t("logindex.propertyType") }}</th>
-                  <th>{{ t("logindex.streamftsKey") }}</th>
-                  <th>{{ t("logindex.streamPartitionKey") }}</th>
+                  <th>{{ t("logStream.propertyName") }}</th>
+                  <th>{{ t("logStream.propertyType") }}</th>
+                  <th>{{ t("logStream.streamftsKey") }}</th>
+                  <th>{{ t("logStream.streamPartitionKey") }}</th>
                 </tr>
               </thead>
               <tbody>
@@ -116,14 +116,14 @@
           <q-btn
             v-close-popup
             class="q-mb-md text-bold no-border"
-            :label="t('logindex.cancel')"
+            :label="t('logStream.cancel')"
             text-color="light-text"
             padding="sm md"
             color="accent"
             no-caps
           />
           <q-btn
-            :label="t('logindex.updateSettings')"
+            :label="t('logStream.updateSettings')"
             class="q-mb-md text-bold no-border q-ml-md"
             color="secondary"
             padding="sm xl"

web/src/locales/languages/en.json

@@ -158,7 +158,7 @@
         "add": "Add Template",
         "search": "Search Template"
     },
-    "logindex": {
+    "logStream": {
         "header": "Streams",
         "search": "Search Stream",
         "name": "Name",

web/src/locales/languages/tr.json

@@ -158,7 +158,7 @@
     "add": "Şablon Ekle",
     "search": "Arama Şablonu"
   },
-  "logindex": {
+  "logStream": {
     "header": "Akarsular",
     "search": "Arama Akışı",
     "name": "İsim",

web/src/locales/languages/zh.json

@@ -158,7 +158,7 @@
     "add": "添加模板",
     "search": "搜索模板"
   },
-  "logindex": {
+  "logStream": {
     "header": "数据流",
     "search": "搜索数据流",
     "name": "名称",

web/src/router/index.ts

@@ -6,12 +6,12 @@ import Users from "../views/User.vue";
 import About from "../views/About.vue";
 import Dashboard from "../views/Dashboard.vue";
 import ViewDashboard from "../views/ViewDashboard.vue";
-import EditPanel     from "../views/EditPanel.vue";
+import EditPanel from "../views/EditPanel.vue";
 
 import LoginCallback from "../views/LoginCallback.vue";
 import MemberSubscription from "../views/MemberSubscription.vue";
 import Search from "../views/Search.vue";
-import LogIndex from "../views/LogIndex.vue";
+import LogStream from "../views/LogStream.vue";
 import JSTransform from "../views/JSTransform.vue";
 import Alerts from "../views/Alerts.vue";
 import Ingestion from "../views/Ingestion.vue";
@@ -23,10 +23,10 @@ import {
   useLocalCurrentUser,
 } from "../utils/zincutils";
 import type { cp } from "fs";
-import FluentBit from '../components/ingestion/FluentBit.vue'
-import Fluentd from '../components/ingestion/Fluentd.vue'
-import Vector from '../components/ingestion/Vector.vue'
-import Curl from '../components/ingestion/Curl.vue'
+import FluentBit from "../components/ingestion/FluentBit.vue";
+import Fluentd from "../components/ingestion/Fluentd.vue";
+import Vector from "../components/ingestion/Vector.vue";
+import Curl from "../components/ingestion/Curl.vue";
 
 import segment from "@/services/segment_analytics";
 
@@ -73,7 +73,7 @@ export default function (store: any) {
         {
           path: "logstreams",
           name: "logstreams",
-          component: LogIndex,
+          component: LogStream,
           meta: {
             keepAlive: true,
           },
@@ -177,7 +177,7 @@ export default function (store: any) {
               name: "vector",
               component: Vector,
             },
-          ]
+          ],
         },
         {
           path: "alerts",

web/src/views/LogStream.vue

@@ -5,7 +5,7 @@
     <q-table
       ref="qTable"
       v-model:selected="selected"
-      :rows="logindex"
+      :rows="logStream"
       :columns="columns"
       row-key="id"
       :pagination="pagination"
@@ -24,7 +24,7 @@
         <q-td :props="props">
           <q-btn
             icon="img:/src/assets/images/common/list_icon.svg"
-            :title="t('logindex.schemaHeader')"
+            :title="t('logStream.schemaHeader')"
             class="q-ml-xs iconHoverBtn"
             padding="sm"
             unelevated
@@ -37,14 +37,14 @@
       </template>
 
       <template #top="scope">
-        <div class="q-table__title">{{ t("logindex.header") }}</div>
+        <div class="q-table__title">{{ t("logStream.header") }}</div>
         <q-input
           v-model="filterQuery"
           borderless
           filled
           dense
           class="q-ml-auto q-mb-xs no-border"
-          :placeholder="t('logindex.search')"
+          :placeholder="t('logStream.search')"
         >
           <template #prepend>
             <q-icon name="search" />
@@ -56,13 +56,13 @@
           color="secondary"
           no-caps
           icon="refresh"
-          :label="t(`logindex.refreshStats`)"
-          @click="getLogIndex"
+          :label="t(`logStream.refreshStats`)"
+          @click="getLogStream"
         />
 
         <QTablePagination
           :scope="scope"
-          :pageTitle="t('logindex.header')"
+          :pageTitle="t('logStream.header')"
           :resultTotal="resultTotal"
           :perPageOptions="perPageOptions"
           position="top"
@@ -92,13 +92,13 @@
     <q-dialog v-model="confirmDelete">
       <q-card style="width: 240px">
         <q-card-section class="confirmBody">
-          <div class="head">{{ t("logindex.confirmDeleteHead") }}</div>
-          <div class="para">{{ t("logindex.confirmDeleteMsg") }}</div>
+          <div class="head">{{ t("logStream.confirmDeleteHead") }}</div>
+          <div class="para">{{ t("logStream.confirmDeleteMsg") }}</div>
         </q-card-section>
 
         <q-card-actions class="confirmActions">
           <q-btn v-close-popup unelevated no-caps class="q-mr-sm">
-            {{ t("logindex.cancel") }}
+            {{ t("logStream.cancel") }}
           </q-btn>
           <q-btn
             v-close-popup
@@ -107,7 +107,7 @@
             class="no-border"
             color="primary"
           >
-            {{ t("logindex.ok") }}
+            {{ t("logStream.ok") }}
           </q-btn>
         </q-card-actions>
       </q-card>
@@ -124,11 +124,11 @@ import { useI18n } from "vue-i18n";
 
 import QTablePagination from "../components/shared/grid/Pagination.vue";
 import indexService from "../services/index";
-import SchemaIndex from "../components/log_index/schema.vue";
+import SchemaIndex from "../components/logstream/schema.vue";
 import NoData from "../components/shared/grid/NoData.vue";
 
 export default defineComponent({
-  name: "PageLogIndex",
+  name: "PageLogStream",
   components: { QTablePagination, SchemaIndex, NoData },
   emits: ["update:changeRecordPerPage", "update:maxRecordToReturn"],
   setup(props, { emit }) {
@@ -136,7 +136,7 @@ export default defineComponent({
     const { t } = useI18n();
     const q = useQuasar();
     const router = useRouter();
-    const logindex = ref([]);
+    const logStream = ref([]);
     const showIndexSchemaDialog = ref(false);
     const confirmDelete = ref<boolean>(false);
     const schemaData = ref({ name: "", schema: [Object], stream_type: "" });
@@ -154,35 +154,35 @@ export default defineComponent({
       {
         name: "name",
         field: "name",
-        label: t("logindex.name"),
+        label: t("logStream.name"),
         align: "left",
         sortable: true,
       },
       {
         name: "stream_type",
         field: "stream_type",
-        label: t("logindex.type"),
+        label: t("logStream.type"),
         align: "left",
         sortable: true,
       },
       {
         name: "doc_num",
         field: "doc_num",
-        label: t("logindex.docNum"),
+        label: t("logStream.docNum"),
         align: "left",
         sortable: true,
       },
       {
         name: "storage_size",
         field: "storage_size",
-        label: t("logindex.storageSize"),
+        label: t("logStream.storageSize"),
         align: "left",
         sortable: true,
       },
       {
         name: "compressed_size",
         field: "compressed_size",
-        label: t("logindex.compressedSize"),
+        label: t("logStream.compressedSize"),
         align: "left",
         sortable: true,
       },
@@ -194,7 +194,7 @@ export default defineComponent({
       },
     ]);
 
-    const getLogIndex = () => {
+    const getLogStream = () => {
       if (store.state.selectedOrganization != null) {
         const dismiss = q.notify({
           spinner: true,
@@ -209,7 +209,7 @@ export default defineComponent({
             let storage_size = "";
             let compressed_size = "";
             resultTotal.value = res.data.list.length;
-            logindex.value = res.data.list.map((data: any) => {
+            logStream.value = res.data.list.map((data: any) => {
               doc_num = "--";
               storage_size = "--";
               if (data.stats) {
@@ -243,7 +243,7 @@ export default defineComponent({
       }
     };
 
-    getLogIndex();
+    getLogStream();
 
     const listSchema = (props: any) => {
       console.log(props.row.schema);
@@ -284,11 +284,11 @@ export default defineComponent({
       qTable,
       router,
       store,
-      logindex,
+      logStream: logStream,
       columns,
       selected,
       orgData,
-      getLogIndex,
+      getLogStream: getLogStream,
       pagination,
       resultTotal,
       listSchema,
@@ -326,12 +326,12 @@ export default defineComponent({
     selectedOrg(newVal: any, oldVal: any) {
       this.orgData = newVal;
       if (
-        (newVal != oldVal || this.logindex.values == undefined) &&
+        (newVal != oldVal || this.logStream.values == undefined) &&
         this.router.currentRoute.value.name == "logstreams"
       ) {
-        this.logindex = [];
+        this.logStream = [];
         this.resultTotal = 0;
-        this.getLogIndex();
+        this.getLogStream();
       }
     },
   },

web/src/views/Login.vue

@@ -4,7 +4,7 @@
       <q-page class="fullscreen bg-grey-7 flex flex-center">
         <q-card square class="my-card shadow-24 bg-white text-white">
           <q-card-section class="bg-primary">
-            <div class="text-h5 q-my-md">Zinc Oxide</div>
+            <div class="text-h5 q-my-md">Zinc Oserve</div>
           </q-card-section>
           <q-card>
             <q-card-section class="bg-white">