diff --git a/packages/web-app-admin-settings/src/components/AppTemplate.vue b/packages/web-app-admin-settings/src/components/AppTemplate.vue
index 6c31d798d0d..e2c0ac38d2d 100644
--- a/packages/web-app-admin-settings/src/components/AppTemplate.vue
+++ b/packages/web-app-admin-settings/src/components/AppTemplate.vue
@@ -51,12 +51,12 @@
         <slot name="mainContent" />
       </div>
       <side-bar
-        v-if="sideBarOpen"
+        v-if="isSideBarOpen"
         :active-panel="sideBarActivePanel"
         :available-panels="sideBarAvailablePanels"
         :panel-context="sideBarPanelContext"
         :loading="sideBarLoading"
-        :open="sideBarOpen"
+        :is-open="isSideBarOpen"
         :is-header-compact="isSideBarHeaderCompact"
         @select-panel="selectPanel"
         @close="closeSideBar"
@@ -101,7 +101,7 @@ export default defineComponent({
       required: true,
       type: Array as PropType<BreadcrumbItem[]>
     },
-    sideBarOpen: {
+    isSideBarOpen: {
       required: false,
       type: Boolean,
       default: false
@@ -165,7 +165,7 @@ export default defineComponent({
     const appBarRef = ref<VNodeRef>()
     const limitedScreenSpace = ref(false)
     const onResize = () => {
-      limitedScreenSpace.value = props.sideBarOpen
+      limitedScreenSpace.value = props.isSideBarOpen
         ? window.innerWidth <= 1600
         : window.innerWidth <= 1200
     }
@@ -213,12 +213,12 @@ export default defineComponent({
   },
   computed: {
     toggleSidebarButtonLabel() {
-      return this.sideBarOpen
+      return this.isSideBarOpen
         ? this.$gettext('Close sidebar to hide details')
         : this.$gettext('Open sidebar to view details')
     },
     toggleSidebarButtonIconFillType() {
-      return this.sideBarOpen ? 'fill' : 'line'
+      return this.isSideBarOpen ? 'fill' : 'line'
     }
   }
 })
diff --git a/packages/web-app-admin-settings/src/views/Groups.vue b/packages/web-app-admin-settings/src/views/Groups.vue
index 131ee79cd76..ddca20ae59c 100644
--- a/packages/web-app-admin-settings/src/views/Groups.vue
+++ b/packages/web-app-admin-settings/src/views/Groups.vue
@@ -7,7 +7,7 @@
       :side-bar-active-panel="sideBarActivePanel"
       :side-bar-available-panels="sideBarAvailablePanels"
       :side-bar-panel-context="sideBarPanelContext"
-      :side-bar-open="sideBarOpen"
+      :is-side-bar-open="isSideBarOpen"
       :show-batch-actions="!!selectedGroups.length"
       :batch-actions="batchActions"
       :batch-action-items="selectedGroups"
diff --git a/packages/web-app-admin-settings/src/views/Spaces.vue b/packages/web-app-admin-settings/src/views/Spaces.vue
index c02b5c0ecc0..ecf35b29dac 100644
--- a/packages/web-app-admin-settings/src/views/Spaces.vue
+++ b/packages/web-app-admin-settings/src/views/Spaces.vue
@@ -7,7 +7,7 @@
       :side-bar-active-panel="sideBarActivePanel"
       :side-bar-available-panels="sideBarAvailablePanels"
       :side-bar-panel-context="sideBarPanelContext"
-      :side-bar-open="sideBarOpen"
+      :is-side-bar-open="isSideBarOpen"
       :is-side-bar-header-compact="selectedSpaces.length === 1"
       :show-batch-actions="!!selectedSpaces.length"
       :batch-actions="batchActions"
@@ -41,7 +41,7 @@
         <div v-else>
           <SpacesList
             :spaces="spaces"
-            :class="{ 'spaces-table-squashed': sideBarOpen }"
+            :class="{ 'spaces-table-squashed': isSideBarOpen }"
             :selected-spaces="selectedSpaces"
             @toggle-select-space="toggleSelectSpace"
             @select-spaces="selectSpaces"
@@ -113,7 +113,7 @@ export default defineComponent({
     const spaces = ref([])
     const clientService = useClientService()
     const { $gettext } = useGettext()
-    const { sideBarOpen, sideBarActivePanel } = useSideBar()
+    const { isSideBarOpen, sideBarActivePanel } = useSideBar()
 
     const loadResourcesEventToken = ref(null)
     let updateQuotaForSpaceEventToken
@@ -281,7 +281,7 @@ export default defineComponent({
 
     return {
       maxQuota: useCapabilitySpacesMaxQuota(),
-      sideBarOpen,
+      isSideBarOpen,
       sideBarActivePanel,
       spaces,
       loadResourcesTask,
diff --git a/packages/web-app-admin-settings/src/views/Users.vue b/packages/web-app-admin-settings/src/views/Users.vue
index 439e56a3342..172136ee552 100644
--- a/packages/web-app-admin-settings/src/views/Users.vue
+++ b/packages/web-app-admin-settings/src/views/Users.vue
@@ -6,7 +6,7 @@
       :side-bar-active-panel="sideBarActivePanel"
       :side-bar-available-panels="sideBarAvailablePanels"
       :side-bar-panel-context="sideBarPanelContext"
-      :side-bar-open="sideBarOpen"
+      :is-side-bar-open="isSideBarOpen"
       :side-bar-loading="sideBarLoading"
       :show-batch-actions="!!selectedUsers.length"
       :batch-actions="batchActions"
@@ -34,7 +34,7 @@
           <UsersList
             :users="users"
             :roles="roles"
-            :class="{ 'users-table-squashed': sideBarOpen }"
+            :class="{ 'users-table-squashed': isSideBarOpen }"
             :selected-users="selectedUsers"
             @toggle-select-user="toggleSelectUser"
             @select-users="selectUsers"
diff --git a/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts b/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
index 3dcbcc5ed88..5b5394f42df 100644
--- a/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
+++ b/packages/web-app-admin-settings/tests/unit/components/AppTemplate.spec.ts
@@ -58,11 +58,11 @@ describe('AppTemplate', () => {
   })
   describe('sideBar', () => {
     it('should show when opened', () => {
-      const { wrapper } = getWrapper({ props: { sideBarOpen: true } })
+      const { wrapper } = getWrapper({ props: { isSideBarOpen: true } })
       expect(wrapper.find(stubSelectors.sideBar).exists()).toBeTruthy()
     })
     it('should not show when closed', () => {
-      const { wrapper } = getWrapper({ props: { sideBarOpen: false } })
+      const { wrapper } = getWrapper({ props: { isSideBarOpen: false } })
       expect(wrapper.find(stubSelectors.sideBar).exists()).toBeFalsy()
     })
     it('can be toggled', async () => {
@@ -129,7 +129,7 @@ function getWrapper({ props = {}, isMobileWidth = false } = {}) {
       props: {
         loading: false,
         breadcrumbs: [],
-        sideBarOpen: true,
+        isSideBarOpen: true,
         sideBarAvailablePanels: [],
         sideBarActivePanel: '',
         ...props
diff --git a/packages/web-app-admin-settings/tests/unit/views/__snapshots__/General.spec.ts.snap b/packages/web-app-admin-settings/tests/unit/views/__snapshots__/General.spec.ts.snap
index c01ad2d76c9..d3ca4e1d51c 100644
--- a/packages/web-app-admin-settings/tests/unit/views/__snapshots__/General.spec.ts.snap
+++ b/packages/web-app-admin-settings/tests/unit/views/__snapshots__/General.spec.ts.snap
@@ -2,6 +2,6 @@
 
 exports[`General view renders component 1`] = `
 <div>
-  <app-template-stub batchactionitems="" batchactions="" breadcrumbs="[object Object],[object Object]" issidebarheadercompact="false" loading="false" showappbar="false" showbatchactions="false" showviewoptions="false" sidebaravailablepanels="" sidebarloading="false" sidebaropen="false"></app-template-stub>
+  <app-template-stub batchactionitems="" batchactions="" breadcrumbs="[object Object],[object Object]" issidebarheadercompact="false" loading="false" showappbar="false" showbatchactions="false" showviewoptions="false" sidebaravailablepanels="" sidebarloading="false" issidebaropen="false"></app-template-stub>
 </div>
 `;
diff --git a/packages/web-app-files/src/components/Search/List.vue b/packages/web-app-files/src/components/Search/List.vue
index c6c2177c0f9..4686ff5c6a5 100644
--- a/packages/web-app-files/src/components/Search/List.vue
+++ b/packages/web-app-files/src/components/Search/List.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="files-search-result oc-flex">
     <files-view-wrapper>
-      <app-bar :breadcrumbs="breadcrumbs" :has-bulk-actions="true" :side-bar-open="sideBarOpen" />
+      <app-bar
+        :breadcrumbs="breadcrumbs"
+        :has-bulk-actions="true"
+        :is-side-bar-open="isSideBarOpen"
+      />
       <div v-if="displayFilter" class="files-search-result-filter oc-flex oc-mx-m oc-mb-m oc-mt-xs">
         <div class="oc-mr-m oc-flex oc-flex-middle">
           <oc-icon name="filter-2" class="oc-mr-xs" />
@@ -138,7 +142,7 @@
       </template>
     </files-view-wrapper>
     <file-side-bar
-      :open="sideBarOpen"
+      :is-open="isSideBarOpen"
       :active-panel="sideBarActivePanel"
       :space="selectedResourceSpace"
     />
diff --git a/packages/web-app-files/src/components/Shares/SharedWithMeSection.vue b/packages/web-app-files/src/components/Shares/SharedWithMeSection.vue
index 08a479bd2a5..b2ef5ac5134 100644
--- a/packages/web-app-files/src/components/Shares/SharedWithMeSection.vue
+++ b/packages/web-app-files/src/components/Shares/SharedWithMeSection.vue
@@ -19,7 +19,7 @@
       v-model:selectedIds="selectedResourcesIds"
       :data-test-share-status="shareStatus"
       class="files-table"
-      :class="{ 'files-table-squashed': sideBarOpen }"
+      :class="{ 'files-table-squashed': isSideBarOpen }"
       :fields-displayed="displayedFields"
       sidebar-closed
       :are-thumbnails-displayed="displayThumbnails"
@@ -171,7 +171,7 @@ export default defineComponent({
       type: Boolean,
       default: true
     },
-    sideBarOpen: {
+    isSideBarOpen: {
       type: Boolean,
       default: false
     },
diff --git a/packages/web-app-files/src/components/Spaces/SpaceHeader.vue b/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
index 16a37c6d2e7..fc5716f8b46 100644
--- a/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
+++ b/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     class="space-header oc-p-m"
-    :class="{ 'oc-flex': !imageExpanded && !isMobileWidth, 'space-header-squashed': sideBarOpen }"
+    :class="{ 'oc-flex': !imageExpanded && !isMobileWidth, 'space-header-squashed': isSideBarOpen }"
   >
     <div
       class="space-header-image"
@@ -106,7 +106,7 @@ export default defineComponent({
       type: Object as PropType<SpaceResource>,
       required: true
     },
-    sideBarOpen: { type: Boolean, default: false }
+    isSideBarOpen: { type: Boolean, default: false }
   },
   setup(props) {
     const language = useGettext()
diff --git a/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts b/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
index 686fa5bc5ed..b778399f0c0 100644
--- a/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
+++ b/packages/web-app-files/src/composables/resourcesViewDefaults/useResourcesViewDefaults.ts
@@ -48,7 +48,7 @@ type ResourcesViewDefaultsResult<T, TT, TU extends any[]> = {
   selectedResourcesIds: Ref<(string | number)[]>
   isResourceInSelection(resource: Resource): boolean
 
-  sideBarOpen: Ref<boolean>
+  isSideBarOpen: Ref<boolean>
   sideBarActivePanel: Ref<string>
 } & SelectedResourcesResult &
   ScrollToResult
diff --git a/packages/web-app-files/src/views/Favorites.vue b/packages/web-app-files/src/views/Favorites.vue
index c08c4b192e1..ed0e0450ea7 100644
--- a/packages/web-app-files/src/views/Favorites.vue
+++ b/packages/web-app-files/src/views/Favorites.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="oc-flex">
     <files-view-wrapper>
-      <app-bar :view-modes="viewModes" :side-bar-open="sideBarOpen" />
+      <app-bar :view-modes="viewModes" :is-side-bar-open="isSideBarOpen" />
       <app-loading-spinner v-if="areResourcesLoading" />
       <template v-else>
         <no-content-message
@@ -19,7 +19,7 @@
           id="files-favorites-table"
           v-model:selectedIds="selectedResourcesIds"
           class="files-table"
-          :class="{ 'files-table-squashed': sideBarOpen }"
+          :class="{ 'files-table-squashed': isSideBarOpen }"
           :are-paths-displayed="true"
           :are-thumbnails-displayed="displayThumbnails"
           :resources="paginatedResources"
@@ -53,7 +53,7 @@
       </template>
     </files-view-wrapper>
     <file-side-bar
-      :open="sideBarOpen"
+      :is-open="isSideBarOpen"
       :active-panel="sideBarActivePanel"
       :space="selectedResourceSpace"
     />
diff --git a/packages/web-app-files/src/views/shares/SharedViaLink.vue b/packages/web-app-files/src/views/shares/SharedViaLink.vue
index ae12a78334f..ad343521c86 100644
--- a/packages/web-app-files/src/views/shares/SharedViaLink.vue
+++ b/packages/web-app-files/src/views/shares/SharedViaLink.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="oc-flex">
     <files-view-wrapper>
-      <app-bar :side-bar-open="sideBarOpen">
+      <app-bar :is-side-bar-open="isSideBarOpen">
         <template #navigation>
           <SharesNavigation />
         </template>
@@ -23,7 +23,7 @@
           id="files-shared-via-link-table"
           v-model:selectedIds="selectedResourcesIds"
           class="files-table"
-          :class="{ 'files-table-squashed': sideBarOpen }"
+          :class="{ 'files-table-squashed': isSideBarOpen }"
           :fields-displayed="['name', 'sharedWith', 'sdate']"
           :are-thumbnails-displayed="displayThumbnails"
           :are-paths-displayed="true"
@@ -56,7 +56,7 @@
       </template>
     </files-view-wrapper>
     <file-side-bar
-      :open="sideBarOpen"
+      :is-open="isSideBarOpen"
       :active-panel="sideBarActivePanel"
       :space="selectedResourceSpace"
     />
diff --git a/packages/web-app-files/src/views/shares/SharedWithMe.vue b/packages/web-app-files/src/views/shares/SharedWithMe.vue
index a2599adb141..852e385c85a 100644
--- a/packages/web-app-files/src/views/shares/SharedWithMe.vue
+++ b/packages/web-app-files/src/views/shares/SharedWithMe.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="oc-flex">
     <files-view-wrapper class="oc-flex-column">
-      <app-bar :has-bulk-actions="true" :side-bar-open="sideBarOpen">
+      <app-bar :has-bulk-actions="true" :is-side-bar-open="isSideBarOpen">
         <template #navigation>
           <SharesNavigation />
         </template>
@@ -72,7 +72,7 @@
           :display-thumbnails="displayThumbnails"
           :file-list-header-y="fileListHeaderY"
           :items="items"
-          :side-bar-open="sideBarOpen"
+          :is-side-bar-open="isSideBarOpen"
           :sort-by="sortBy"
           :sort-dir="sortDir"
           :sort-handler="handleSort"
@@ -85,7 +85,7 @@
       </template>
     </files-view-wrapper>
     <file-side-bar
-      :open="sideBarOpen"
+      :is-open="isSideBarOpen"
       :active-panel="sideBarActivePanel"
       :space="selectedShareSpace"
     />
@@ -97,7 +97,12 @@ import Fuse from 'fuse.js'
 import Mark from 'mark.js'
 import { useResourcesViewDefaults } from '../../composables'
 
-import { AppLoadingSpinner, FileSideBar, InlineFilterOption, ItemFilter } from '@ownclouders/web-pkg'
+import {
+  AppLoadingSpinner,
+  FileSideBar,
+  InlineFilterOption,
+  ItemFilter
+} from '@ownclouders/web-pkg'
 import { AppBar, ItemFilterInline } from '@ownclouders/web-pkg'
 import { queryItemAsString, useRouteQuery } from '@ownclouders/web-pkg'
 import SharedWithMeSection from '../../components/Shares/SharedWithMeSection.vue'
@@ -135,7 +140,7 @@ export default defineComponent({
       selectedResources,
       selectedResourcesIds,
       sideBarActivePanel,
-      sideBarOpen,
+      isSideBarOpen,
       storeItems,
       scrollToResourceFromRoute
     } = useResourcesViewDefaults<Resource, any, any[]>()
@@ -260,7 +265,7 @@ export default defineComponent({
       selectedResources,
       selectedResourcesIds,
       fileListHeaderY,
-      sideBarOpen,
+      isSideBarOpen,
       sideBarActivePanel,
       selectedShareSpace,
 
diff --git a/packages/web-app-files/src/views/shares/SharedWithOthers.vue b/packages/web-app-files/src/views/shares/SharedWithOthers.vue
index 1e0a9e354d6..4230567b33e 100644
--- a/packages/web-app-files/src/views/shares/SharedWithOthers.vue
+++ b/packages/web-app-files/src/views/shares/SharedWithOthers.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="oc-flex">
     <files-view-wrapper>
-      <app-bar :side-bar-open="sideBarOpen">
+      <app-bar :is-side-bar-open="isSideBarOpen">
         <template #navigation>
           <SharesNavigation />
         </template>
@@ -45,7 +45,7 @@
           id="files-shared-with-others-table"
           v-model:selectedIds="selectedResourcesIds"
           class="files-table"
-          :class="{ 'files-table-squashed': sideBarOpen }"
+          :class="{ 'files-table-squashed': isSideBarOpen }"
           :fields-displayed="['name', 'sharedWith', 'sdate']"
           :are-thumbnails-displayed="displayThumbnails"
           :are-paths-displayed="true"
@@ -77,7 +77,7 @@
       </template>
     </files-view-wrapper>
     <file-side-bar
-      :open="sideBarOpen"
+      :is-open="isSideBarOpen"
       :active-panel="sideBarActivePanel"
       :space="selectedResourceSpace"
     />
diff --git a/packages/web-app-files/src/views/spaces/GenericSpace.vue b/packages/web-app-files/src/views/spaces/GenericSpace.vue
index 4c1827ff6bc..a80ce406fec 100644
--- a/packages/web-app-files/src/views/spaces/GenericSpace.vue
+++ b/packages/web-app-files/src/views/spaces/GenericSpace.vue
@@ -9,7 +9,7 @@
         :show-actions-on-selection="displayFullAppBar"
         :has-sidebar-toggle="displayFullAppBar"
         :has-view-options="displayFullAppBar"
-        :side-bar-open="sideBarOpen"
+        :is-side-bar-open="isSideBarOpen"
         :space="space"
         :view-modes="viewModes"
         @item-dropped="fileDropped"
@@ -48,7 +48,7 @@
           <space-header
             v-if="hasSpaceHeader"
             :space="space"
-            :side-bar-open="sideBarOpen"
+            :is-side-bar-open="isSideBarOpen"
             class="oc-px-m oc-mt-m"
           />
           <no-content-message
@@ -107,7 +107,7 @@
             id="files-space-table"
             v-model:selectedIds="selectedResourcesIds"
             class="files-table"
-            :class="{ 'files-table-squashed': sideBarOpen }"
+            :class="{ 'files-table-squashed': isSideBarOpen }"
             :view-mode="viewMode"
             :are-thumbnails-displayed="displayThumbnails"
             :resources="paginatedResources"
@@ -150,7 +150,7 @@
         </template>
       </template>
     </files-view-wrapper>
-    <file-side-bar :open="sideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
+    <file-side-bar :is-open="isSideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
   </div>
 </template>
 
diff --git a/packages/web-app-files/src/views/spaces/GenericTrash.vue b/packages/web-app-files/src/views/spaces/GenericTrash.vue
index e5009f81f9e..668e7db8c45 100644
--- a/packages/web-app-files/src/views/spaces/GenericTrash.vue
+++ b/packages/web-app-files/src/views/spaces/GenericTrash.vue
@@ -4,7 +4,7 @@
       <app-bar
         :breadcrumbs="breadcrumbs"
         :has-bulk-actions="true"
-        :side-bar-open="sideBarOpen"
+        :is-side-bar-open="isSideBarOpen"
         :space="space"
       />
       <app-loading-spinner v-if="areResourcesLoading" />
@@ -25,7 +25,7 @@
           id="files-trashbin-table"
           v-model:selectedIds="selectedResourcesIds"
           class="files-table"
-          :class="{ 'files-table-squashed': sideBarOpen }"
+          :class="{ 'files-table-squashed': isSideBarOpen }"
           :fields-displayed="['name', 'ddate']"
           :are-paths-displayed="true"
           :are-thumbnails-displayed="false"
@@ -56,7 +56,7 @@
         </resource-table>
       </template>
     </files-view-wrapper>
-    <file-side-bar :open="sideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
+    <file-side-bar :is-open="isSideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
   </div>
 </template>
 
diff --git a/packages/web-app-files/src/views/spaces/Projects.vue b/packages/web-app-files/src/views/spaces/Projects.vue
index e15067a43dd..d5bdc8a45de 100644
--- a/packages/web-app-files/src/views/spaces/Projects.vue
+++ b/packages/web-app-files/src/views/spaces/Projects.vue
@@ -9,7 +9,7 @@
         :has-hidden-files="false"
         :has-file-extensions="false"
         :has-pagination="false"
-        :side-bar-open="sideBarOpen"
+        :is-side-bar-open="isSideBarOpen"
         :view-modes="viewModes"
         :view-mode-default="ViewModeConstants.tilesView.name"
       >
@@ -92,7 +92,7 @@
             v-model:selectedIds="selectedResourcesIds"
             :resources="paginatedItems"
             class="spaces-table"
-            :class="{ 'spaces-table-squashed': sideBarOpen }"
+            :class="{ 'spaces-table-squashed': isSideBarOpen }"
             :sticky="false"
             :fields-displayed="tableDisplayFields"
             :are-thumbnails-displayed="true"
@@ -151,7 +151,11 @@
         </div>
       </template>
     </files-view-wrapper>
-    <file-side-bar :open="sideBarOpen" :active-panel="sideBarActivePanel" :space="selectedSpace" />
+    <file-side-bar
+      :is-open="isSideBarOpen"
+      :active-panel="sideBarActivePanel"
+      :space="selectedSpace"
+    />
   </div>
 </template>
 
diff --git a/packages/web-app-files/tests/mocks/useResourcesViewDefaultsMock.ts b/packages/web-app-files/tests/mocks/useResourcesViewDefaultsMock.ts
index 7b13b2e554a..ae8382e544c 100644
--- a/packages/web-app-files/tests/mocks/useResourcesViewDefaultsMock.ts
+++ b/packages/web-app-files/tests/mocks/useResourcesViewDefaultsMock.ts
@@ -26,7 +26,7 @@ export const useResourcesViewDefaultsMock = (
     selectedResourcesIds: ref([]),
     selectedResourceSpace: ref(mock<SpaceResource>()),
     isResourceInSelection: jest.fn(() => false),
-    sideBarOpen: ref(false),
+    isSideBarOpen: ref(false),
     sideBarActivePanel: ref(''),
     scrollToResource: jest.fn(),
     scrollToResourceFromRoute: jest.fn(),
diff --git a/packages/web-app-files/tests/unit/components/Spaces/SpaceHeader.spec.ts b/packages/web-app-files/tests/unit/components/Spaces/SpaceHeader.spec.ts
index e86fd6353ab..ba151b53473 100644
--- a/packages/web-app-files/tests/unit/components/Spaces/SpaceHeader.spec.ts
+++ b/packages/web-app-files/tests/unit/components/Spaces/SpaceHeader.spec.ts
@@ -14,7 +14,7 @@ describe('SpaceHeader', () => {
   it('should add the "squashed"-class when the sidebar is opened', () => {
     const wrapper = getWrapper({
       space: buildSpace({ id: '1' } as unknown as Drive),
-      sideBarOpen: true
+      isSideBarOpen: true
     })
     expect(wrapper.find('.space-header-squashed').exists()).toBeTruthy()
     expect(wrapper.html()).toMatchSnapshot()
@@ -46,13 +46,13 @@ describe('SpaceHeader', () => {
   })
 })
 
-function getWrapper({ space = {}, sideBarOpen = false, isMobileWidth = false }) {
+function getWrapper({ space = {}, isSideBarOpen = false, isMobileWidth = false }) {
   const mocks = defaultComponentMocks()
   const store = createStore(defaultStoreMockOptions)
   return mount(SpaceHeader, {
     props: {
       space,
-      sideBarOpen
+      isSideBarOpen
     },
     global: {
       mocks,
diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
index a43548847ae..35d6f593365 100644
--- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
+++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap
@@ -4,7 +4,7 @@ exports[`Projects view different files view states lists all available project s
 <div class="oc-flex oc-width-1-1">
   <div class="files-view-wrapper oc-width-expand">
     <div id="files-view">
-      <app-bar-stub breadcrumbs="[object Object]" breadcrumbscontextactionsitems="" hasbulkactions="true" hasfileextensions="false" hashiddenfiles="false" haspagination="false" hassidebartoggle="true" hasviewoptions="true" showactionsonselection="true" sidebaropen="false" viewmodedefault="resource-tiles" viewmodes="[object Object],[object Object]"></app-bar-stub>
+      <app-bar-stub breadcrumbs="[object Object]" breadcrumbscontextactionsitems="" hasbulkactions="true" hasfileextensions="false" hashiddenfiles="false" haspagination="false" hassidebartoggle="true" hasviewoptions="true" showactionsonselection="true" issidebaropen="false" viewmodedefault="resource-tiles" viewmodes="[object Object],[object Object]"></app-bar-stub>
       <div class="spaces-list oc-mt-l">
         <div class="spaces-list-filters oc-flex oc-flex-right oc-px-m oc-mb-m">
           <div class="">
@@ -23,6 +23,6 @@ exports[`Projects view different files view states lists all available project s
     </div>
   </div>
   <!--v-if-->
-  <side-bar-stub open="false"></side-bar-stub>
+  <side-bar-stub is-open="false"></side-bar-stub>
 </div>
 `;
diff --git a/packages/web-app-files/tests/unit/views/trash/__snapshots__/Overview.spec.ts.snap b/packages/web-app-files/tests/unit/views/trash/__snapshots__/Overview.spec.ts.snap
index f808ef486e0..0a9b67f2c0e 100644
--- a/packages/web-app-files/tests/unit/views/trash/__snapshots__/Overview.spec.ts.snap
+++ b/packages/web-app-files/tests/unit/views/trash/__snapshots__/Overview.spec.ts.snap
@@ -4,7 +4,7 @@ exports[`TrashOverview view states should render spaces list 1`] = `
 <div class="oc-flex">
   <div class="files-view-wrapper oc-width-expand">
     <div id="files-view">
-      <app-bar-stub breadcrumbs="[object Object]" breadcrumbscontextactionsitems="" hasbulkactions="false" hasfileextensions="false" hashiddenfiles="false" haspagination="false" hassidebartoggle="false" hasviewoptions="false" showactionsonselection="false" sidebaropen="false" viewmodedefault="resource-table" viewmodes=""></app-bar-stub>
+      <app-bar-stub breadcrumbs="[object Object]" breadcrumbscontextactionsitems="" hasbulkactions="false" hasfileextensions="false" hashiddenfiles="false" haspagination="false" hassidebartoggle="false" hasviewoptions="false" showactionsonselection="false" issidebaropen="false" viewmodedefault="resource-table" viewmodes=""></app-bar-stub>
       <div class="trash-bin-filters oc-flex oc-flex-right oc-flex-wrap oc-flex-bottom oc-mx-m oc-mb-m">
         <div class="">
           <label class="oc-label" for="spaces-filter">Search</label>
diff --git a/packages/web-app-preview/src/App.vue b/packages/web-app-preview/src/App.vue
index 4688b6aabaf..437dd31450b 100644
--- a/packages/web-app-preview/src/App.vue
+++ b/packages/web-app-preview/src/App.vue
@@ -64,7 +64,7 @@
           @toggle-next="next"
         />
       </div>
-      <file-side-bar :open="sideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
+      <file-side-bar :is-open="isSideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
     </div>
   </main>
 </template>
diff --git a/packages/web-client/src/helpers/index.ts b/packages/web-client/src/helpers/index.ts
index 1bad5ec785e..a46e6eb91fb 100644
--- a/packages/web-client/src/helpers/index.ts
+++ b/packages/web-client/src/helpers/index.ts
@@ -1,8 +1,7 @@
 export * from './group'
+export * from './item'
 export * from './publicLink'
 export * from './resource'
 export * from './share'
 export * from './space'
 export * from './user'
-
-export * from './item'
diff --git a/packages/web-pkg/src/components/AppBar/AppBar.vue b/packages/web-pkg/src/components/AppBar/AppBar.vue
index 75801eda724..3d04fd7e528 100644
--- a/packages/web-pkg/src/components/AppBar/AppBar.vue
+++ b/packages/web-pkg/src/components/AppBar/AppBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="files-app-bar" ref="filesAppBar" :class="{ 'files-app-bar-squashed': sideBarOpen }">
+  <div id="files-app-bar" ref="filesAppBar" :class="{ 'files-app-bar-squashed': isSideBarOpen }">
     <quota-modal
       v-if="quotaModalIsOpen"
       :cancel="closeQuotaModal"
@@ -51,7 +51,7 @@
             per-page-storage-prefix="files"
             :view-mode-default="viewModeDefault"
           />
-          <sidebar-toggle v-if="hasSidebarToggle" :side-bar-open="sideBarOpen" />
+          <sidebar-toggle v-if="hasSidebarToggle" :is-side-bar-open="isSideBarOpen" />
         </div>
       </div>
       <div class="files-app-bar-actions oc-mt-xs">
@@ -157,7 +157,7 @@ export default defineComponent({
     hasFileExtensions: { type: Boolean, default: true },
     hasPagination: { type: Boolean, default: true },
     showActionsOnSelection: { type: Boolean, default: false },
-    sideBarOpen: { type: Boolean, default: false },
+    isSideBarOpen: { type: Boolean, default: false },
     space: {
       type: Object as PropType<SpaceResource>,
       required: false,
@@ -344,7 +344,7 @@ export default defineComponent({
 
       this.breadcrumbMaxWidth =
         totalContentWidth - leftSidebarWidth - rightSidebarWidth - rightControlsWidth
-      this.limitedScreenSpace = this.sideBarOpen
+      this.limitedScreenSpace = this.isSideBarOpen
         ? window.innerWidth <= 1280
         : window.innerWidth <= 1000
     }
diff --git a/packages/web-pkg/src/components/AppBar/SidebarToggle.vue b/packages/web-pkg/src/components/AppBar/SidebarToggle.vue
index 79dd5837783..d39a702b9b5 100644
--- a/packages/web-pkg/src/components/AppBar/SidebarToggle.vue
+++ b/packages/web-pkg/src/components/AppBar/SidebarToggle.vue
@@ -18,21 +18,21 @@ import { SideBarEventTopics } from '../../composables/sideBar'
 
 export default defineComponent({
   props: {
-    sideBarOpen: {
+    isSideBarOpen: {
       type: Boolean,
       default: false
     }
   },
   computed: {
     toggleSidebarButtonLabel() {
-      if (this.sideBarOpen) {
+      if (this.isSideBarOpen) {
         return this.$gettext('Close sidebar to hide details')
       }
       return this.$gettext('Open sidebar to view details')
     },
 
     toggleSidebarButtonIconFillType() {
-      return this.sideBarOpen ? 'fill' : 'line'
+      return this.isSideBarOpen ? 'fill' : 'line'
     }
   },
   methods: {
diff --git a/packages/web-pkg/src/components/AppTemplates/AppWrapper.vue b/packages/web-pkg/src/components/AppTemplates/AppWrapper.vue
index 998f4495557..cd172133686 100644
--- a/packages/web-pkg/src/components/AppTemplates/AppWrapper.vue
+++ b/packages/web-pkg/src/components/AppTemplates/AppWrapper.vue
@@ -11,7 +11,7 @@
     <error-screen v-else-if="loadingError" :message="loadingError.message" />
     <div v-else class="oc-flex oc-width-1-1 oc-height-1-1">
       <slot v-bind="slotAttrs" />
-      <file-side-bar :open="sideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
+      <file-side-bar :is-open="isSideBarOpen" :active-panel="sideBarActivePanel" :space="space" />
     </div>
   </main>
 </template>
diff --git a/packages/web-pkg/src/components/AppTopBar.vue b/packages/web-pkg/src/components/AppTopBar.vue
index 973dd4c3a0c..8105f168143 100644
--- a/packages/web-pkg/src/components/AppTopBar.vue
+++ b/packages/web-pkg/src/components/AppTopBar.vue
@@ -74,7 +74,7 @@
         </div>
       </span>
       <oc-button @click="toggleSideBar">
-        {{ sideBarOpen }}
+        {{ isSideBarOpen }}
         <oc-icon name="side-bar-right" />
       </oc-button>
     </div>
@@ -152,7 +152,7 @@ export default defineComponent({
     const toggleSideBar = () => {
       eventBus.publish(SideBarEventTopics.toggle)
     }
-    const { sideBarOpen } = useSideBar()
+    const { isSideBarOpen } = useSideBar()
 
     return {
       pathPrefix,
@@ -161,7 +161,7 @@ export default defineComponent({
       closeButtonLabel,
       parentFolderName,
       parentFolderLinkIconAdditionalAttributes,
-      sideBarOpen,
+      isSideBarOpen,
       toggleSideBar
     }
   }
diff --git a/packages/web-pkg/src/components/SideBar/FileSideBar.vue b/packages/web-pkg/src/components/SideBar/FileSideBar.vue
index b7223c31108..ac9857a1f6b 100644
--- a/packages/web-pkg/src/components/SideBar/FileSideBar.vue
+++ b/packages/web-pkg/src/components/SideBar/FileSideBar.vue
@@ -1,10 +1,10 @@
 <template>
   <InnerSideBar
-    v-if="open"
+    v-if="isOpen"
     ref="sidebar"
     class="files-side-bar"
     tabindex="-1"
-    :open="open"
+    :is-open="isOpen"
     :active-panel="activePanel"
     :available-panels="availablePanels"
     :panel-context="panelContext"
@@ -63,7 +63,7 @@ export default defineComponent({
   name: 'FileSideBar',
   components: { FileInfo, SpaceInfo, InnerSideBar },
   props: {
-    open: {
+    isOpen: {
       type: Boolean,
       required: true
     },
@@ -168,9 +168,9 @@ export default defineComponent({
     )
 
     watch(
-      () => [...unref(panelContext).items, props.open],
+      () => [...unref(panelContext).items, props.isOpen],
       async () => {
-        if (!props.open) {
+        if (!props.isOpen) {
           return
         }
         if (unref(panelContext).items?.length !== 1) {
diff --git a/packages/web-pkg/src/components/SideBar/SideBar.vue b/packages/web-pkg/src/components/SideBar/SideBar.vue
index 36ba1d214f2..e2d9cee82fd 100644
--- a/packages/web-pkg/src/components/SideBar/SideBar.vue
+++ b/packages/web-pkg/src/components/SideBar/SideBar.vue
@@ -98,7 +98,7 @@ let hiddenObserver: VisibilityObserver
 
 export default defineComponent({
   props: {
-    open: {
+    isOpen: {
       type: Boolean,
       required: true
     },
@@ -178,9 +178,9 @@ export default defineComponent({
       },
       immediate: true
     },
-    open: {
-      handler: function (open) {
-        if (!open) {
+    isOpen: {
+      handler: function (isOpen) {
+        if (!isOpen) {
           return
         }
         this.$nextTick(() => {
diff --git a/packages/web-pkg/src/composables/sideBar/useSideBar.ts b/packages/web-pkg/src/composables/sideBar/useSideBar.ts
index 36e29913e45..bfdd46bf95f 100644
--- a/packages/web-pkg/src/composables/sideBar/useSideBar.ts
+++ b/packages/web-pkg/src/composables/sideBar/useSideBar.ts
@@ -3,7 +3,7 @@ import { EventBus, eventBus as defaultEventBus } from '../../services/eventBus'
 import { SideBarEventTopics } from './eventTopics'
 
 interface SideBarResult {
-  sideBarOpen: Ref<boolean>
+  isSideBarOpen: Ref<boolean>
   sideBarActivePanel: Ref<string>
 }
 
@@ -13,23 +13,23 @@ interface SideBarOptions {
 
 export const useSideBar = (options?: SideBarOptions): SideBarResult => {
   const eventBus = options?.bus || defaultEventBus
-  const sideBarOpen = ref(false)
+  const isSideBarOpen = ref(false)
   const sideBarActivePanel = ref(null)
   const toggleSideBarToken = eventBus.subscribe(SideBarEventTopics.toggle, () => {
-    sideBarOpen.value = !unref(sideBarOpen)
+    isSideBarOpen.value = !unref(isSideBarOpen)
   })
   const closeSideBarToken = eventBus.subscribe(SideBarEventTopics.close, () => {
-    sideBarOpen.value = false
+    isSideBarOpen.value = false
     sideBarActivePanel.value = null
   })
   const openSideBarToken = eventBus.subscribe(SideBarEventTopics.open, () => {
-    sideBarOpen.value = true
+    isSideBarOpen.value = true
     sideBarActivePanel.value = null
   })
   const openSideBarWithPanelToken = eventBus.subscribe(
     SideBarEventTopics.openWithPanel,
     (panelName: string) => {
-      sideBarOpen.value = true
+      isSideBarOpen.value = true
       sideBarActivePanel.value = panelName
     }
   )
@@ -48,7 +48,7 @@ export const useSideBar = (options?: SideBarOptions): SideBarResult => {
   })
 
   return {
-    sideBarOpen: readonly(sideBarOpen),
+    isSideBarOpen: readonly(isSideBarOpen),
     sideBarActivePanel: readonly(sideBarActivePanel)
   }
 }
diff --git a/packages/web-pkg/tests/unit/components/AppBar/SidebarToggle.spec.ts b/packages/web-pkg/tests/unit/components/AppBar/SidebarToggle.spec.ts
index ab89a75e2ad..0e8c141999a 100644
--- a/packages/web-pkg/tests/unit/components/AppBar/SidebarToggle.spec.ts
+++ b/packages/web-pkg/tests/unit/components/AppBar/SidebarToggle.spec.ts
@@ -15,8 +15,8 @@ const selectors = {
 describe('SidebarToggle component', () => {
   it.each([true, false])(
     'should show the "Toggle sidebar"-button with sidebar opened and closed',
-    (sideBarOpen) => {
-      const { wrapper } = getWrapper({ sideBarOpen })
+    (isSideBarOpen) => {
+      const { wrapper } = getWrapper({ isSideBarOpen })
       expect(wrapper.find(selectors.toggleSidebarBtn).exists()).toBeTruthy()
       expect(wrapper.html()).toMatchSnapshot()
     }
@@ -29,7 +29,7 @@ describe('SidebarToggle component', () => {
   })
 })
 
-function getWrapper({ sideBarOpen = false } = {}) {
+function getWrapper({ isSideBarOpen = false } = {}) {
   const storeOptions = { ...defaultStoreMockOptions }
   const store = createStore(storeOptions)
   const mocks = defaultComponentMocks()
@@ -37,7 +37,7 @@ function getWrapper({ sideBarOpen = false } = {}) {
     storeOptions,
     mocks,
     wrapper: mount(SidebarToggle, {
-      props: { sideBarOpen },
+      props: { isSideBarOpen },
       global: {
         mocks,
         plugins: [...defaultPlugins(), store]
diff --git a/packages/web-pkg/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap b/packages/web-pkg/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap
index b73d02f070c..a49fca6692f 100644
--- a/packages/web-pkg/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap
+++ b/packages/web-pkg/tests/unit/components/AppBar/__snapshots__/AppBar.spec.ts.snap
@@ -12,7 +12,7 @@ exports[`AppBar component renders by default no breadcrumbs, no bulkactions, no
       <!--v-if-->
       <div class="oc-flex" id="files-app-bar-controls-right">
         <view-options-stub hasfileextensions="true" hashiddenfiles="true" haspagination="true" paginationoptions="20,50,100,250,500" perpagedefault="100" perpagequeryname="items-per-page" perpagestorageprefix="files" viewmodedefault="resource-table" viewmodes=""></view-options-stub>
-        <sidebar-toggle-stub sidebaropen="false"></sidebar-toggle-stub>
+        <sidebar-toggle-stub issidebaropen="false"></sidebar-toggle-stub>
       </div>
     </div>
     <div class="files-app-bar-actions oc-mt-xs">
@@ -37,7 +37,7 @@ exports[`AppBar component renders if given, with content in the actions slot 1`]
       <!--v-if-->
       <div class="oc-flex" id="files-app-bar-controls-right">
         <view-options-stub hasfileextensions="true" hashiddenfiles="true" haspagination="true" paginationoptions="20,50,100,250,500" perpagedefault="100" perpagequeryname="items-per-page" perpagestorageprefix="files" viewmodedefault="resource-table" viewmodes=""></view-options-stub>
-        <sidebar-toggle-stub sidebaropen="false"></sidebar-toggle-stub>
+        <sidebar-toggle-stub issidebaropen="false"></sidebar-toggle-stub>
       </div>
     </div>
     <div class="files-app-bar-actions oc-mt-xs">
@@ -62,7 +62,7 @@ exports[`AppBar component renders if given, with content in the content slot 1`]
       <!--v-if-->
       <div class="oc-flex" id="files-app-bar-controls-right">
         <view-options-stub hasfileextensions="true" hashiddenfiles="true" haspagination="true" paginationoptions="20,50,100,250,500" perpagedefault="100" perpagequeryname="items-per-page" perpagestorageprefix="files" viewmodedefault="resource-table" viewmodes=""></view-options-stub>
-        <sidebar-toggle-stub sidebaropen="false"></sidebar-toggle-stub>
+        <sidebar-toggle-stub issidebaropen="false"></sidebar-toggle-stub>
       </div>
     </div>
     <div class="files-app-bar-actions oc-mt-xs">
diff --git a/packages/web-pkg/tests/unit/composables/sideBar/useSideBar.spec.ts b/packages/web-pkg/tests/unit/composables/sideBar/useSideBar.spec.ts
index 2b34ed027cb..ad17118baed 100644
--- a/packages/web-pkg/tests/unit/composables/sideBar/useSideBar.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/sideBar/useSideBar.spec.ts
@@ -9,10 +9,10 @@ describe('useSideBar', () => {
     eventBus = new EventBus()
   })
   describe('initial state', () => {
-    it('should have "sideBarOpen" as "false"', () => {
+    it('should have "isSideBarOpen" as "false"', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
-        expect(unref(sideBarOpen)).toBe(false)
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
+        expect(unref(isSideBarOpen)).toBe(false)
       })
     })
     it('should have "sideBarActivePanel" as "null"', () => {
@@ -23,11 +23,11 @@ describe('useSideBar', () => {
     })
   })
   describe('open', () => {
-    it('should set "sideBarOpen" to "true"', () => {
+    it('should set "isSideBarOpen" to "true"', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
         eventBus.publish(SideBarEventTopics.open)
-        expect(unref(sideBarOpen)).toBe(true)
+        expect(unref(isSideBarOpen)).toBe(true)
       })
     })
     it('should set "sideBarActivePanel" to "null"', () => {
@@ -39,11 +39,11 @@ describe('useSideBar', () => {
     })
   })
   describe('close', () => {
-    it('should set "sideBarOpen" to "false"', () => {
+    it('should set "isSideBarOpen" to "false"', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
         eventBus.publish(SideBarEventTopics.close)
-        expect(unref(sideBarOpen)).toBe(false)
+        expect(unref(isSideBarOpen)).toBe(false)
       })
     })
     it('should set "sideBarActivePanel" to "null"', () => {
@@ -55,13 +55,13 @@ describe('useSideBar', () => {
     })
   })
   describe('toggle', () => {
-    it('should toggle "sideBarOpen" back and forth', () => {
+    it('should toggle "isSideBarOpen" back and forth', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
         eventBus.publish(SideBarEventTopics.toggle)
-        expect(unref(sideBarOpen)).toBe(true)
+        expect(unref(isSideBarOpen)).toBe(true)
         eventBus.publish(SideBarEventTopics.toggle)
-        expect(unref(sideBarOpen)).toBe(false)
+        expect(unref(isSideBarOpen)).toBe(false)
       })
     })
     it('should not influence "sideBarActivePanel"', () => {
@@ -78,11 +78,11 @@ describe('useSideBar', () => {
     })
   })
   describe('openWithPanel', () => {
-    it('should set "sideBarOpen" to "true"', () => {
+    it('should set "isSideBarOpen" to "true"', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
         eventBus.publish(SideBarEventTopics.openWithPanel, 'SomePanel')
-        expect(unref(sideBarOpen)).toBe(true)
+        expect(unref(isSideBarOpen)).toBe(true)
       })
     })
     it('should set "sideBarActivePanel" to provided value', () => {
@@ -94,11 +94,11 @@ describe('useSideBar', () => {
     })
   })
   describe('setActivePanel', () => {
-    it('should not influence "sideBarOpen"', () => {
+    it('should not influence "isSideBarOpen"', () => {
       getComposableWrapper(() => {
-        const { sideBarOpen } = useSideBar({ bus: eventBus })
+        const { isSideBarOpen } = useSideBar({ bus: eventBus })
         eventBus.publish(SideBarEventTopics.setActivePanel)
-        expect(unref(sideBarOpen)).toBe(false)
+        expect(unref(isSideBarOpen)).toBe(false)
       })
     })
     it('should set "sideBarActivePanel" to provided value', () => {