fix: after context docs, some light fixes and cleanup (#6030)

kestra-io · Nov 21, 2024 · 62fd559 · 62fd559
1 parent 5ad0fc3
commit 62fd559
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 243 deletions.
diff --git a/ui/src/components/ContextInfoBar.vue b/ui/src/components/ContextInfoBar.vue
@@ -32,8 +32,6 @@
 
     const panelWidth = ref(640)
 
-    const panel = ref<HTMLElement | null>(null)
-
     const activeTab = ref("")
 
     const {startResizing, resizing} = useResizablePanel(activeTab)
@@ -70,12 +68,6 @@
         return {startResizing, resizing}
     }
 
-    function scrollToTop(){
-        if(panel.value) {
-            panel.value.scrollTop = 0
-        }
-    }
-
     function setActiveTab(tab: string){
         if(activeTab.value === tab){
             activeTab.value = ""
@@ -120,12 +112,12 @@
             <span class="commitNumber">{{ configs?.commitId }}</span>
         </el-tooltip>
     </div>
-    <div ref="panel" class="panelWrapper" :class="{panelTabResizing: resizing}" :style="{width: activeTab?.length ? `${panelWidth}px` : 0}">
+    <div class="panelWrapper" :class="{panelTabResizing: resizing}" :style="{width: activeTab?.length ? `${panelWidth}px` : 0}">
         <div :style="{overflow: 'hidden', width:`${panelWidth}px`}">
             <button v-if="activeTab.length" class="closeButton" @click="activeTab = ''">
                 <Close />
             </button>
-            <ContextDocs v-if="activeTab === 'docs'" @update:doc-path="scrollToTop" />
+            <ContextDocs v-if="activeTab === 'docs'" />
             <ContextNews v-else-if="activeTab === 'news'" />
             <template v-else>
                 {{ activeTab }}

diff --git a/ui/src/components/docs/ContextDocs.vue b/ui/src/components/docs/ContextDocs.vue
@@ -17,14 +17,14 @@
     const store = useStore();
     const {t} = useI18n();
 
+    const docWrapper = ref<HTMLDivElement | null>(null);
+
     const pageMetadata = computed(() => store.getters["doc/pageMetadata"]);
     const docPath = computed(() => store.getters["doc/docPath"]);
     const routeInfo = computed(() => ({
         title: pageMetadata.value?.title ?? t("docs"),
     }))
 
-    const emit = defineEmits(["update:docPath"]);
-
     onUnmounted(() => {
         ast.value = undefined
         store.commit("doc/setDocPath", undefined);
@@ -42,7 +42,7 @@
     watch(docPath, async (val) => {
         refreshPage(val);
         nextTick(() => {
-            emit("update:docPath", val);
+            docWrapper.value?.scrollTo(0, 0);
         });
     }, {immediate: true});
 
@@ -58,7 +58,7 @@
 </script>
 
 <template>
-    <div class="docWrapper">
+    <div class="docWrapper" ref="docWrapper">
         <h2 class="docTitle">
             <router-link
                 :to="{

diff --git a/ui/src/components/layout/ContextNews.vue b/ui/src/components/layout/ContextNews.vue
@@ -25,7 +25,9 @@
 
 <template>
     <div class="allContextNews">
-        <h3>{{ t("feeds.title") }}</h3>
+        <h2 class="newsTitle">
+            {{ t("feeds.title") }}
+        </h2>
         <el-divider style="margin: var(--spacer) 0;" />
         <div class="post" :class="{lastPost: index === 0, expanded: expanded[feed.id]}" v-for="(feed, index) in feeds" :key="feed.id">
             <div v-if="feed.image" class="mr-2">
@@ -70,6 +72,10 @@
         padding: var(--spacer);
     }
 
+    .newsTitle{
+        font-size: 18px;
+    }
+
     .post {
         h5 {
             font-weight: medium;

diff --git a/ui/src/components/layout/News.vue b/ui/src/components/layout/News.vue
diff --git a/ui/src/components/layout/TopNavBar.vue b/ui/src/components/layout/TopNavBar.vue
@@ -33,67 +33,6 @@
             </div>
             <slot name="additional-right" />
             <div class="d-flex fixed-buttons icons">
-                <el-dropdown popper-class="">
-                    <el-button class="no-focus dropdown-button">
-                        <HelpBox />
-                    </el-button>
-                    <template #dropdown>
-                        <el-dropdown-menu>
-                            <a
-                                href="https://kestra.io/slack?utm_source=app&utm_campaign=slack&utm_content=top-nav-bar"
-                                target="_blank"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <HelpBox class="align-middle" /> {{ $t("live help") }}
-                            </a>
-                            <a
-                                v-if="tourEnabled"
-                                @click="restartGuidedTour"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <ProgressQuestion class="align-middle" /> {{ $t('Reset guided tour') }}
-                            </a>
-
-                            <router-link
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                                :to="{name: 'docs/view'}"
-                            >
-                                <BookMultipleOutline class="align-middle" /> {{ $t("documentation.documentation") }}
-                            </router-link>
-
-                            <a
-                                href="https://github.com/kestra-io/kestra/issues"
-                                target="_blank"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <Github class="align-middle" /> {{ $t("documentation.github") }}
-                            </a>
-                            <a
-                                href="https://kestra.io/slack?utm_source=app&utm_campaign=slack&utm_content=top-nav-bar"
-                                target="_blank"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <Slack class="align-middle" /> {{ $t("join community") }}
-                            </a>
-                            <a
-                                href="https://kestra.io/demo?utm_source=app&utm_campaign=sales&utm_content=top-nav-bar"
-                                target="_blank"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <EmailHeartOutline class="align-middle" /> {{ $t("reach us") }}
-                            </a>
-                            <a
-                                v-if="version"
-                                :href="version.url"
-                                target="_blank"
-                                class="d-flex gap-2 el-dropdown-menu__item"
-                            >
-                                <Update class="align-middle text-danger" /> <span class="text-danger">{{ $t("new version", {"version": version.latest}) }}</span>
-                            </a>
-                        </el-dropdown-menu>
-                    </template>
-                </el-dropdown>
-
                 <impersonating />
                 <auth />
             </div>
@@ -105,13 +44,6 @@
     import {mapState, mapGetters} from "vuex";
     import Auth from "override/components/auth/Auth.vue";
     import Impersonating from "override/components/auth/Impersonating.vue";
-    import HelpBox from "vue-material-design-icons/HelpBox.vue";
-    import BookMultipleOutline from "vue-material-design-icons/BookMultipleOutline.vue";
-    import Github from "vue-material-design-icons/Github.vue";
-    import Slack from "vue-material-design-icons/Slack.vue";
-    import EmailHeartOutline from "vue-material-design-icons/EmailHeartOutline.vue";
-    import Update from "vue-material-design-icons/Update.vue";
-    import ProgressQuestion from "vue-material-design-icons/ProgressQuestion.vue";
     import GlobalSearch from "./GlobalSearch.vue";
     import TrashCan from "vue-material-design-icons/TrashCan.vue";
     import StarOutlineIcon from "vue-material-design-icons/StarOutline.vue";
@@ -121,13 +53,6 @@
     export default {
         components: {
             Auth,
-            HelpBox,
-            BookMultipleOutline,
-            Github,
-            Slack,
-            EmailHeartOutline,
-            Update,
-            ProgressQuestion,
             GlobalSearch,
             TrashCan,
             Impersonating