refactor: update hopp-ui to be independent (#2927)

Co-authored-by: Anwarul Islam <anwaarulislaam@gmail.com>

packages/hoppscotch-common/src/components/history/graphql/Card.vue

@@ -15,7 +15,7 @@
           {{ entry.request.url }}
         </span>
       </span>
-      <ButtonSecondary
+      <HoppButtonSecondary
         v-tippy="{ theme: 'tooltip' }"
         :icon="IconTrash"
         color="red"
@@ -24,14 +24,14 @@
         data-testid="delete_history_entry"
         @click="emit('delete-entry')"
       />
-      <ButtonSecondary
+      <HoppButtonSecondary
         v-tippy="{ theme: 'tooltip' }"
         :title="expand ? t('hide.more') : t('show.more')"
         :icon="expand ? IconMinimize2 : IconMaximize2"
         class="hidden group-hover:inline-flex"
         @click="expand = !expand"
       />
-      <ButtonSecondary
+      <HoppButtonSecondary
         v-tippy="{ theme: 'tooltip' }"
         :title="!entry.star ? t('add.star') : t('remove.star')"
         :icon="entry.star ? IconStarOff : IconStar"

packages/hoppscotch-common/src/components/history/index.vue

@@ -11,7 +11,7 @@
         :placeholder="`${t('action.search')}`"
       />
       <div class="flex">
-        <ButtonSecondary
+        <HoppButtonSecondary
           v-tippy="{ theme: 'tooltip' }"
           to="https://docs.hoppscotch.io/features/history"
           blank
@@ -19,7 +19,7 @@
           :icon="IconHelpCircle"
         />
         <tippy interactive trigger="click" theme="popover">
-          <ButtonSecondary
+          <HoppButtonSecondary
             v-tippy="{ theme: 'tooltip' }"
             :title="t('action.filter')"
             :icon="IconFilter"
@@ -29,7 +29,7 @@
               <div class="pb-2 pl-4 text-tiny text-secondaryLight">
                 {{ t("action.filter") }}
               </div>
-              <SmartRadioGroup
+              <HoppSmartRadioGroup
                 v-model="filterSelection"
                 :radios="filters"
                 @update:model-value="hide()"
@@ -38,7 +38,7 @@
               <div class="pb-2 pl-4 text-tiny text-secondaryLight">
                 {{ t("action.group_by") }}
               </div>
-              <SmartRadioGroup
+              <HoppSmartRadioGroup
                 v-model="groupSelection"
                 :radios="groups"
                 @update:model-value="hide()"
@@ -46,7 +46,7 @@
             </div>
           </template>
         </tippy>
-        <ButtonSecondary
+        <HoppButtonSecondary
           v-tippy="{ theme: 'tooltip' }"
           data-testid="clear_history"
           :disabled="history.length === 0"
@@ -81,7 +81,7 @@
               {{ filteredHistoryGroupIndex }}
             </span>
           </span>
-          <ButtonSecondary
+          <HoppButtonSecondary
             v-tippy="{ theme: 'tooltip' }"
             :icon="IconTrash"
             color="red"
@@ -128,7 +128,7 @@
       <span class="mt-2 mb-4 text-center">
         {{ t("state.nothing_found") }} "{{ filterText || filterSelection }}"
       </span>
-      <ButtonSecondary
+      <HoppButtonSecondary
         :label="t('action.clear')"
         outline
         @click="
@@ -139,7 +139,7 @@
         "
       />
     </div>
-    <SmartConfirmModal
+    <HoppSmartConfirmModal
       :show="confirmRemove"
       :title="`${t('confirm.remove_history')}`"
       @hide-modal="confirmRemove = false"

packages/hoppscotch-common/src/components/history/rest/Card.vue

@@ -26,7 +26,7 @@
         {{ entry.request.endpoint }}
       </span>
     </span>
-    <ButtonSecondary
+    <HoppButtonSecondary
       v-tippy="{ theme: 'tooltip' }"
       :icon="IconTrash"
       color="red"
@@ -35,7 +35,7 @@
       data-testid="delete_history_entry"
       @click="emit('delete-entry')"
     />
-    <ButtonSecondary
+    <HoppButtonSecondary
       v-tippy="{ theme: 'tooltip' }"
       :title="!entry.star ? t('add.star') : t('remove.star')"
       :class="{ 'group-hover:inline-flex hidden': !entry.star }"