diff --git a/client/src/components/ActivityBar/ActivityBar.vue b/client/src/components/ActivityBar/ActivityBar.vue
index 0d48d3e01051..7f12bc1545aa 100644
--- a/client/src/components/ActivityBar/ActivityBar.vue
+++ b/client/src/components/ActivityBar/ActivityBar.vue
@@ -10,6 +10,7 @@ import { type Activity, useActivityStore } from "@/stores/activityStore";
 import { useEventStore } from "@/stores/eventStore";
 import { useUserStore } from "@/stores/userStore";
 
+import VisualizationPanel from "../Panels/VisualizationPanel.vue";
 import ActivityItem from "./ActivityItem.vue";
 import InteractiveItem from "./Items/InteractiveItem.vue";
 import NotificationItem from "./Items/NotificationItem.vue";
@@ -150,7 +151,7 @@ function onToggleSidebar(toggle: string) {
                                 :to="activity.to"
                                 @click="onToggleSidebar()" />
                             <ActivityItem
-                                v-else-if="['tools', 'workflows'].includes(activity.id)"
+                                v-else-if="['tools', 'workflows', 'visualizations'].includes(activity.id)"
                                 :id="`activity-${activity.id}`"
                                 :key="activity.id"
                                 :icon="activity.icon"
@@ -193,6 +194,7 @@ function onToggleSidebar(toggle: string) {
         <FlexPanel v-if="isSideBarOpen" side="left" :collapsible="false">
             <ToolPanel v-if="isActiveSideBar('tools')" />
             <WorkflowPanel v-else-if="isActiveSideBar('workflows')" />
+            <VisualizationPanel v-else-if="isActiveSideBar('visualizations')" />
             <NotificationsPanel v-else-if="isActiveSideBar('notifications')" />
             <SettingsPanel v-else-if="isActiveSideBar('settings')" />
         </FlexPanel>
diff --git a/client/src/components/Panels/VisualizationPanel.vue b/client/src/components/Panels/VisualizationPanel.vue
new file mode 100644
index 000000000000..c38af166b961
--- /dev/null
+++ b/client/src/components/Panels/VisualizationPanel.vue
@@ -0,0 +1,10 @@
+<script setup lang="ts">
+import ActivityPanel from "@/components/Panels/ActivityPanel.vue";
+import PluginList from "@/components/Visualizations/PluginList.vue";
+</script>
+
+<template>
+    <ActivityPanel title="Visualizations">
+        <PluginList />
+    </ActivityPanel>
+</template>
diff --git a/client/src/components/Visualizations/PluginList.vue b/client/src/components/Visualizations/PluginList.vue
index 25ed2d6fad6f..2c9ac18ead3b 100644
--- a/client/src/components/Visualizations/PluginList.vue
+++ b/client/src/components/Visualizations/PluginList.vue
@@ -1,55 +1,61 @@
 <template>
     <div class="plugin-list">
         <div v-if="error" class="alert alert-danger">{{ error }}</div>
-        <div v-else>
+        <template v-else>
             <DelayedInput
                 class="mb-3"
                 :query="search"
                 :placeholder="titleSearchVisualizations"
                 :delay="100"
                 @change="onSearch" />
-            <div v-for="plugin in plugins" :key="plugin.name">
-                <table v-if="match(plugin)">
-                    <tr class="plugin-list-item" :data-plugin-name="plugin.name" @click="select(plugin)">
-                        <td>
-                            <img v-if="plugin.logo" alt="ui thumbnails" class="plugin-list-image" :src="plugin.logo" />
-                            <div v-else class="plugin-list-icon fa fa-eye" />
-                        </td>
-                        <td>
-                            <div class="plugin-list-title font-weight-bold">{{ plugin.html }}</div>
-                            <div class="plugin-list-text">{{ plugin.description }}</div>
-                        </td>
-                    </tr>
-                    <tr v-if="!fixed">
-                        <td />
-                        <td v-if="plugin.name == name">
-                            <div v-if="hdas && hdas.length > 0">
-                                <div class="font-weight-bold">{{ titleSelectDataset }}</div>
-                                <div class="ui-select">
-                                    <select v-model="selected" class="select">
-                                        <option v-for="file in hdas" :key="file.id" :value="file.id">
-                                            {{ file.name }}
-                                        </option>
-                                    </select>
-                                    <div class="icon-dropdown fa fa-caret-down" />
+            <div class="plugin-list-items">
+                <div v-for="plugin in plugins" :key="plugin.name">
+                    <table v-if="match(plugin)">
+                        <tr class="plugin-list-item" :data-plugin-name="plugin.name" @click="select(plugin)">
+                            <td>
+                                <img
+                                    v-if="plugin.logo"
+                                    alt="ui thumbnails"
+                                    class="plugin-list-image"
+                                    :src="plugin.logo" />
+                                <div v-else class="plugin-list-icon fa fa-eye" />
+                            </td>
+                            <td>
+                                <div class="plugin-list-title font-weight-bold">{{ plugin.html }}</div>
+                                <div class="plugin-list-text">{{ plugin.description }}</div>
+                            </td>
+                        </tr>
+                        <tr v-if="!fixed">
+                            <td />
+                            <td v-if="plugin.name == name">
+                                <div v-if="hdas && hdas.length > 0">
+                                    <div class="font-weight-bold">{{ titleSelectDataset }}</div>
+                                    <div class="ui-select">
+                                        <select v-model="selected" class="select">
+                                            <option v-for="file in hdas" :key="file.id" :value="file.id">
+                                                {{ file.name }}
+                                            </option>
+                                        </select>
+                                        <div class="icon-dropdown fa fa-caret-down" />
+                                    </div>
+                                    <button
+                                        type="button"
+                                        class="ui-button-default float-left mt-3 btn btn-primary"
+                                        @click="create(plugin)">
+                                        <i class="icon fa fa-check" />
+                                        <span class="title">{{ titleCreateVisualization }}</span>
+                                    </button>
                                 </div>
-                                <button
-                                    type="button"
-                                    class="ui-button-default float-left mt-3 btn btn-primary"
-                                    @click="create(plugin)">
-                                    <i class="icon fa fa-check" />
-                                    <span class="title">{{ titleCreateVisualization }}</span>
-                                </button>
-                            </div>
-                            <div v-else v-localize class="alert alert-danger">
-                                There is no suitable dataset in your current history which can be visualized with this
-                                plugin.
-                            </div>
-                        </td>
-                    </tr>
-                </table>
+                                <div v-else v-localize class="alert alert-danger">
+                                    There is no suitable dataset in your current history which can be visualized with
+                                    this plugin.
+                                </div>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
             </div>
-        </div>
+        </template>
     </div>
 </template>
 <script>
@@ -157,6 +163,14 @@ export default {
 @import "~scss/mixins.scss";
 
 .plugin-list {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+
+    .plugin-list-items {
+        overflow-y: auto;
+    }
+
     .plugin-list-item {
         cursor: pointer;
         .plugin-list-image {
@@ -173,7 +187,7 @@ export default {
             color: $text-color;
         }
         .plugin-list-text {
-            word-wrap: break-word;
+            word-break: break-word;
         }
     }
     .plugin-list-item:hover {
diff --git a/client/src/stores/activitySetup.ts b/client/src/stores/activitySetup.ts
index 2155bddb9c54..ff2b62533534 100644
--- a/client/src/stores/activitySetup.ts
+++ b/client/src/stores/activitySetup.ts
@@ -67,7 +67,7 @@ export const Activities = [
         mutable: false,
         optional: true,
         title: "Visualize",
-        to: "/visualizations",
+        to: null,
         tooltip: "Visualize datasets",
         visible: true,
     },