refactor: enable new tab component

packages/hoppscotch-app/components/http/Sidebar.vue

@@ -1,11 +1,10 @@
 <template>
-  <SmartTabs styles="sticky bg-primary z-10 top-0" vertical>
-    <SmartTab
-      :id="'history'"
-      icon="clock"
-      :label="`${$t('tab.history')}`"
-      :selected="true"
-    >
+  <SmartTabs
+    v-model="selectedNavigationTab"
+    styles="sticky bg-primary z-10 top-0"
+    vertical
+  >
+    <SmartTab :id="'history'" icon="clock" :label="`${$t('tab.history')}`">
       <History ref="historyComponent" :page="'rest'" />
     </SmartTab>
     <SmartTab
@@ -20,3 +19,11 @@
     </SmartTab>
   </SmartTabs>
 </template>
+
+<script setup lang="ts">
+import { ref } from "@nuxtjs/composition-api"
+
+type RequestOptionTabs = "history" | "collections" | "env"
+
+const selectedNavigationTab = ref<RequestOptionTabs>("history")
+</script>