Fix video autoclose (#6843)

Signed-off-by: Kristina Fefelova <kristin.fefelova@gmail.com>

plugins/chunter-resources/src/components/chat/navigator/NavItem.svelte

@@ -102,7 +102,7 @@
       <div class="antiHSpacer" />
     {:else if secondaryNotifyMarker}
       <div class="antiHSpacer" />
-      <NotifyMarker count={0} kind="simple" />
+      <NotifyMarker count={0} kind="with-dot" />
       <div class="antiHSpacer" />
     {/if}
   </svelte:fragment>

plugins/love-resources/src/components/ControlExt.svelte

@@ -301,7 +301,8 @@
   }
 
   function checkActiveVideo (loc: Location, video: boolean, room: Ref<Room> | undefined): void {
-    const isOpened = $sidebarStore.widgetsState.has(love.ids.VideoWidget)
+    const widgetState = $sidebarStore.widgetsState.get(love.ids.VideoWidget)
+    const isOpened = widgetState !== undefined
 
     if (room === undefined) {
       if (isOpened) {
@@ -319,11 +320,15 @@
           {
             room
           },
-          loc.path[2] !== loveId
+          { active: loc.path[2] !== loveId, openedByUser: false }
         )
       }
 
-      if (loc.path[2] === loveId && $sidebarStore.widget === love.ids.VideoWidget) {
+      if (
+        loc.path[2] === loveId &&
+        $sidebarStore.widget === love.ids.VideoWidget &&
+        widgetState?.openedByUser !== true
+      ) {
         minimizeSidebar()
       }
     } else {

plugins/notification-resources/src/components/NotifyMarker.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   export let count: number = 0
-  export let kind: 'primary' | 'simple' = 'primary'
+  export let kind: 'primary' | 'simple' | 'with-dot' = 'primary'
   export let size: 'xx-small' | 'x-small' | 'small' | 'medium' = 'small'
 
   const maxNumber = 9
@@ -34,6 +34,10 @@
   <div class="notifyMarker {size} {kind}" />
 {/if}
 
+{#if kind === 'with-dot'}
+  <div class="notifyMarker {size} {kind}">●</div>
+{/if}
+
 <style lang="scss">
   .notifyMarker {
     display: flex;
@@ -44,6 +48,7 @@
     font-weight: 700;
 
     &.simple,
+    &.with-dot,
     &.primary {
       background-color: var(--global-higlight-Color);
       color: var(--global-on-accent-TextColor);
@@ -70,5 +75,10 @@
       height: 1.25rem;
       font-size: 0.625rem;
     }
+
+    &.with-dot {
+      font-weight: 400;
+      font-size: 0.25rem;
+    }
   }
 </style>

plugins/workbench-resources/src/components/sidebar/widgets/WidgetsBar.svelte

@@ -33,7 +33,7 @@
     if (selected === widget._id) {
       minimizeSidebar(true)
     } else {
-      openWidget(widget, $sidebarStore.widgetsState.get(widget._id)?.data, true)
+      openWidget(widget, $sidebarStore.widgetsState.get(widget._id)?.data, { active: true, openedByUser: true })
     }
   }
 

plugins/workbench-resources/src/sidebar.ts

@@ -32,6 +32,7 @@ export interface WidgetState {
   tabs: WidgetTab[]
   tab?: string
   closedByUser?: boolean
+  openedByUser?: boolean
 }
 
 export interface SidebarState {
@@ -97,16 +98,23 @@ function setSidebarStateToLocalStorage (state: SidebarState): void {
   )
 }
 
-export function openWidget (widget: Widget, data?: Record<string, any>, active = true): void {
+export function openWidget (
+  widget: Widget,
+  data?: Record<string, any>,
+  params?: { active: boolean, openedByUser: boolean }
+): void {
   const state = get(sidebarStore)
   const { widgetsState } = state
   const widgetState = widgetsState.get(widget._id)
+  const active = params?.active ?? true
+  const openedByUser = params?.openedByUser ?? false
 
   widgetsState.set(widget._id, {
     _id: widget._id,
     data: data ?? widgetState?.data,
     tab: widgetState?.tab,
-    tabs: widgetState?.tabs ?? []
+    tabs: widgetState?.tabs ?? [],
+    openedByUser
   })
 
   Analytics.handleEvent('workbench.OpenSidebarWidget', { widget: widget._id })