@uxland/primary-shell 3.5.2 → 3.5.4

package/src/internal-plugins/activity-history/activity-history-item/list/UI/main-view/activity-history-main.ts

@@ -0,0 +1,91 @@
+import { parse } from "date-fns";
+import { LitElement, css, html, unsafeCSS } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { PrimariaApi, PrimariaRegionHost } from "../../../../../../api/api";
+import { BrokerDisposableHandler } from "../../../../../../api/broker/primaria-broker";
+import { shellEvents } from "../../../../../../events";
+import { lazyInject } from "../../../../infrastructure/ioc/container";
+import { TYPES } from "../../../../infrastructure/ioc/types";
+import { connectedProperty } from "../../../../infrastructure/state/connected-property";
+import { SearchActivityHistoryItems } from "../../../search/request";
+import { activityHistoryCollectionsSelector } from "../../selectors";
+import { ActivityHistoryTimeline } from "../timeline/activity-history-timeline";
+import styles from "./styles.css?inline";
+import { template } from "./template";
+
+//@ts-ignore
+@customElement("activity-history-main")
+export class ActivityHistoryMain extends PrimariaRegionHost(LitElement) {
+  render() {
+    return html`${template(this)}`;
+  }
+
+  static styles = css`
+    ${unsafeCSS(styles)}
+  `;
+
+  subscriptions: BrokerDisposableHandler[] = [];
+
+  connectedCallback() {
+    super.connectedCallback();
+    this._subscribeEvents();
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._unsubscribeEvents();
+  }
+
+  @property({ type: Boolean })
+  maximized = false;
+
+  @lazyInject(TYPES.primaryApi)
+  api: PrimariaApi;
+
+  @connectedProperty(activityHistoryCollectionsSelector)
+  historyItems: any[];
+
+  _maximize() {
+    this.maximized = true;
+  }
+
+  _minimize() {
+    this.maximized = false;
+  }
+
+  _subscribeEvents() {
+    const subscription = this.api.broker.subscribe(
+      shellEvents.openClinicalMonitoringRequested,
+      () => {
+        this.maximized = false;
+      },
+    );
+    this.subscriptions.push(subscription);
+  }
+
+  _unsubscribeEvents() {
+    this.subscriptions.forEach((s) => s.dispose());
+  }
+
+  @property()
+  searchQuery = "";
+
+  _handleSelectDate(date: string) {
+    const selectedDate = parse(date, "dd/MM/yyyy", new Date());
+    this.scrollToClosestDate(selectedDate);
+  }
+
+  _handleSearchChange(event: CustomEvent) {
+    if (typeof event.detail !== "string") return;
+    this.searchQuery = event.detail;
+    this.api.broker.send(new SearchActivityHistoryItems(this.searchQuery));
+  }
+
+  scrollToClosestDate(date: Date) {
+    const selectedDate = date.getTime();
+    const timeline = this.shadowRoot.querySelector(
+      "activity-history-timeline",
+    ) as ActivityHistoryTimeline;
+    timeline._scrollIntoDate(selectedDate);
+  }
+}

package/src/internal-plugins/activity-history/{components/activity-history → activity-history-item/list/UI/main-view}/styles.css

@@ -100,13 +100,6 @@
         white-space: nowrap;
       }
     }
-    .header__search {
-      flex: 1;
-      border-radius: 8px;
-      border: 1px solid rgb(189, 189, 189);
-      padding: 8px;
-      width: 300px;
-    }
     .header__right {
       display: flex;
       flex-direction: row;
@@ -131,43 +124,13 @@
         border-top-right-radius: var(--dss-radius-sm);
       }
     }
-    .filters-sidebar {
-      padding: 8px 4px;
-      border-right: 1px solid rgb(189, 189, 189);
-      width: 30px;
-      &[expanded] {
-        width: 296px;
-        .filters-sidebar-opened {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          padding-inline: 8px;
-          color: var(--color-neutral-900);
-          font-weight: 700;
-          font-size: 16px;
-          line-height: 24px;
-        }
-      }
-    }
+    
     .content {
       width: 100%;
       background: var(--color-neutral-50);
       border-bottom-right-radius: var(--dss-radius-sm);
       overflow: hidden; 
-      .spinner-container {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        gap: 24px;
-        justify-content: center;
-      }
-      .spinner-full-container {
-        width: 100%;
-        height: 100%;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
+      
     }
   }
 }

package/src/internal-plugins/activity-history/{components/activity-history → activity-history-item/list/UI/main-view}/template.ts

@@ -1,12 +1,9 @@
-import { html, nothing } from "lit";
-import { ActivityHistory } from "./activity-history";
-import "./activity-history-search-header/activity-history-search-header"
-import "./activity-history-timeline/activity-history-timeline";
-import "../export-pdf-modal/export-pdf-modal";
-import { ExportPdf } from "../../features/export-to-pdf/request";
-import { translate } from "../../localization";
+import { html } from "lit";
+import { ActivityHistoryMain } from "./activity-history-main";
+import { ExportPdf } from "../../../export-to-pdf/request";
+import { translate } from "../../../../localization";
 import { when } from "lit/directives/when.js";
-export const template = (props: ActivityHistory) =>
+export const template = (props: ActivityHistoryMain) =>
   html`<div class="container" ?maximized=${props.maximized}>
   ${
     props.maximized
@@ -14,10 +11,7 @@ export const template = (props: ActivityHistory) =>
       : html`<div class="header">
             <div class="header__left">
                 <div class="title">${translate("activityHistory")}</div>
-                <dss-search-bar dropdownStyle=${"display: none"} @onSearchChange=${props._handleSearchChange} icon="search" inputsize="md" threshold="2" recentsearchestext="" emptydropdowntext="">
-                    <label slot="label" for="searchbar1" aria-hidden="false"></label>
-                    <input slot="input" id="searchbar1" type="text" value=${props.searchQuery} @input=${(e) => props._handleSearchChange({ detail: [e.target.value] })}>
-                </dss-search-bar>
+                <activity-history-search-bar @onSearchChange=${props._handleSearchChange} .searchQuery=${props.searchQuery}></activity-history-search-bar>
                 <dss-datepicker dropdownFixed inputsize="md" class="date-picker" @onValueChange=${(event) => props._handleSelectDate(event.detail)}>
                     <label slot="label" for="myDatepicker">${translate("goToDate")}</label>
                     <input slot="input" id="myDatepicker" type="text" class="dss-input">
@@ -37,36 +31,21 @@ export const template = (props: ActivityHistory) =>
         </div>`
   } 
         <div class="wrapper" ?maximized=${props.maximized}>
-          <div class="filters-sidebar" ?expanded=${props.filtersExpanded} >
-            ${
-              props.filtersExpanded
-                ? html`<div class="filters-sidebar-opened">${translate("filters.filters")}<dss-icon-button @click=${() => props._toggleFilters()} size="md" variant="primary" icon="keyboard_double_arrow_left"></dss-icon-button></div>`
-                : html`<dss-icon-button @click=${() => props._toggleFilters()} size="md" variant="primary" icon="keyboard_double_arrow_right"></dss-icon-button>`
-            }  
-          </div>
+          <activity-history-filters></activity-history-filters>
           <div class="content">
-            ${when(props.searchQuery.length > 1,() => html`<activity-history-search-header searchQuery="${props.searchQuery}"></activity-history-search-header>`)}
-            ${
-              props.isAnyCollectionLoadingWithoutAnyLoaded
-                ? html`<div class="spinner-full-container"><dss-spinner></dss-spinner></div>`
-                : props.isSomeCollectionLoadedAndOtherLoading
-                  ? html`<div class="spinner-container"><dss-spinner size="sm"></dss-spinner><div class="busy-description">${translate("busyEntriesLoading")}</div></div>`
-                  : nothing
-            }
+            ${when(props.searchQuery.length > 1, () => html`<activity-history-search-header searchQuery="${props.searchQuery}"></activity-history-search-header>`)}
+            <activity-history-busy></activity-history-busy>
             <activity-history-timeline></activity-history-timeline>
           </div>  
         </div>
     </div>`;
 
-export const headerMaximizedTemplate = (props: ActivityHistory) => html`
+export const headerMaximizedTemplate = (props: ActivityHistoryMain) => html`
     <div class="header-maximized-container">
         <div class="header__maximized">
             <div class="header__maximized__left">
                 <div class="title">${translate("activityHistory")}</div>
-                <dss-search-bar dropdownStyle=${"display: none"} @onSearchChange=${props._handleSearchChange} icon="search" inputsize="md" threshold="3" recentsearchestext="" emptydropdowntext="Sense resultats per">
-                    <label slot="label" for="searchbar1" aria-hidden="false"></label>
-                    <input slot="input" id="searchbar1" type="text" value=${props.searchQuery} @input=${(e) => props._handleSearchChange({ detail: [e.target.value] })}>
-                </dss-search-bar>
+                <activity-history-search-bar @onSearchChange=${props._handleSearchChange} .searchQuery=${props.searchQuery}></activity-history-search-bar>
                 <dss-datepicker dropdownFixed inputsize="md" class="date-picker" @onValueChange=${(event) => props._handleSelectDate(event.detail)}>
                     <label slot="label" for="myDatepicker">${translate("goToDate")}</label>
                     <input slot="input" id="myDatepicker" type="text" class="dss-input">

package/src/internal-plugins/activity-history/{components/activity-history/activity-history-timeline → activity-history-item/list/UI/timeline}/activity-history-timeline.ts

@@ -1,20 +1,19 @@
 import { LitElement, css, html, unsafeCSS } from "lit";
-import { PrimariaRegionHost } from "../../../../../api/api";
 import { customElement } from "lit/decorators.js";
+import { connectedProperty } from "../../../../infrastructure/state/connected-property";
+import { IActivityHistoryGroup } from "../../../domain/model";
+import { activityHistorySearchStringSelector } from "../../../search/selectors";
 import {
-  activityHistoryGroupedItems,
-  activityHistorySearchStringSelector,
   isAnyCollectionLoadingWithoutAnyLoaded,
   isSomeCollectionLoadedAndOtherLoading,
-} from "../../../infrastructure/state/selectors";
-import { connectedProperty } from "../../../infrastructure/state/connected-property";
+} from "../../handle-busy/selectors";
+import { activityHistoryGroupedItems } from "../../selectors";
 import styles from "./styles.css?inline";
 import { template } from "./template";
-import { IActivityHistoryGroup } from "../../../domain/model";
 
 //@ts-ignore
 @customElement("activity-history-timeline")
-export class ActivityHistoryTimeline extends PrimariaRegionHost(LitElement) {
+export class ActivityHistoryTimeline extends LitElement {
   render() {
     return html`${template(this)}`;
   }
@@ -46,4 +45,22 @@ export class ActivityHistoryTimeline extends PrimariaRegionHost(LitElement) {
     const regex = new RegExp(`(${searchString})`, "gi");
     return text.replace(regex, `<span class="highlight">$1</span>`);
   }
+
+  _scrollIntoDate(selectedDate: number) {
+    let closestElement = null;
+    let closestDifference = Number.POSITIVE_INFINITY;
+    this.shadowRoot.querySelectorAll(".visit").forEach((element) => {
+      const itemDate = new Date(element.dataset.date).getTime();
+      const difference = Math.abs(itemDate - selectedDate);
+
+      if (difference < closestDifference) {
+        closestDifference = difference;
+        closestElement = element;
+      }
+    });
+
+    if (closestElement) {
+      closestElement.scrollIntoView({ behavior: "smooth", block: "start" });
+    }
+  }
 }

package/src/internal-plugins/activity-history/{components/activity-history/activity-history-timeline → activity-history-item/list/UI/timeline}/styles.css

@@ -8,7 +8,7 @@
   flex-direction: column;
   gap: 16px;
   padding-inline: 16px;
-  padding-top: 17px;
+  padding-top: 16px;
   min-height: 1px;
   height: 100%;
   overflow-y: auto;

package/src/internal-plugins/activity-history/{components/activity-history/activity-history-timeline → activity-history-item/list/UI/timeline}/template.ts

@@ -1,16 +1,17 @@
 import { html, nothing } from "lit";
 import { ActivityHistoryTimeline } from "./activity-history-timeline";
 import { repeat } from "lit/directives/repeat.js";
+import { IEntityDescription } from "@primaria/plugins-core";
+import { format } from "date-fns";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+import notFound from "../../../../../../UI/images/not-found.svg";
+import { ifDefined } from "lit/directives/if-defined.js";
 import {
   IActivityHistoryGroup,
   IActivityHistoryItem,
   IActivityHistorySubGroup,
 } from "../../../domain/model";
-import { IEntityDescription } from "@primaria/plugins-core";
-import { format } from "date-fns";
-import { translate } from "../../../localization";
-import { unsafeHTML } from "lit/directives/unsafe-html.js";
-import notFound from "../../../../../UI/images/not-found.svg";
+import { translate } from "../../../../localization";
 
 export const template = (props: ActivityHistoryTimeline) => {
   if (!props._hasUpdatedOnce) {
@@ -21,7 +22,7 @@ export const template = (props: ActivityHistoryTimeline) => {
       props.historyGroups && props.historyGroups.length > 0
         ? repeat(props.historyGroups, (itemGroup: IActivityHistoryGroup) => {
             return html`
-          <div class="visit" data-date=${itemGroup.items[0]?.date || itemGroup.subGroups[0]?.items[0]?.date}>
+          <div class="visit" data-date=${ifDefined(itemGroup.items[0]?.date || itemGroup.subGroups[0]?.items[0]?.date)}>
             ${visitHeaderTemplate(props, itemGroup.items[0] || itemGroup.subGroups[0]?.items[0])}
             <div class="visit__items">
               ${repeat(
@@ -38,7 +39,7 @@ export const template = (props: ActivityHistoryTimeline) => {
                       <div class="diagnostics__items">${repeat(
                         subGroup.items,
                         (item: IActivityHistoryItem) =>
-                          html`<div class="item">${item.componentFactory(item)}</div>  `,
+                          html`<div class="item">${item?.componentFactory(item)}</div>  `,
                       )}</div>
                     </div>
                 `,

package/src/internal-plugins/activity-history/activity-history-item/list/bootstrapper.ts

@@ -0,0 +1,5 @@
+import "./UI/timeline/activity-history-timeline";
+
+export const bootstrapListActivityHistoryItems = () => {
+  () => null;
+};

package/src/internal-plugins/activity-history/{domain → activity-history-item/list}/group-history-items/group-history-items.test.ts

@@ -1,6 +1,6 @@
 import { describe, it, expect } from "vitest";
 import { groupActivityHistoryItems } from "./group-history-items";
-import { IActivityHistoryItem } from "../model";
+import { IActivityHistoryItem } from "../../domain/model";
 describe("groupActivityHistoryItems", () => {
   it("should group items by visit and then by diagnostics", () => {
     const items: IActivityHistoryItem[] = [

package/src/internal-plugins/activity-history/{domain → activity-history-item/list}/group-history-items/group-history-items.ts

@@ -1,5 +1,9 @@
-import {IEntityDescription} from '@primaria/plugins-core';
-import {IActivityHistoryGroup, IActivityHistoryItem, IActivityHistorySubGroup} from '../model';
+import { IEntityDescription } from "@primaria/plugins-core";
+import {
+  IActivityHistoryItem,
+  IActivityHistoryGroup,
+  IActivityHistorySubGroup,
+} from "../../domain/model";
 
 const isSameVisit = (item1: IActivityHistoryItem, item2: IActivityHistoryItem): boolean => {
   const sameProfessional =
@@ -27,8 +31,8 @@ const areSameDiagnostics = (diag1: IEntityDescription[], diag2: IEntityDescripti
     return false;
   }
 
-  const sortedDiag1 = diag1.map(d => d.id).sort();
-  const sortedDiag2 = diag2.map(d => d.id).sort();
+  const sortedDiag1 = diag1.map((d) => d.id).sort();
+  const sortedDiag2 = diag2.map((d) => d.id).sort();
 
   return sortedDiag1.every((id, index) => id === sortedDiag2[index]);
 };
@@ -36,7 +40,7 @@ const areSameDiagnostics = (diag1: IEntityDescription[], diag2: IEntityDescripti
 const groupActivityHistoryItems = (items: IActivityHistoryItem[]): IActivityHistoryGroup[] => {
   const groups: IActivityHistoryGroup[] = [];
 
-  items?.forEach(item => {
+  items?.forEach((item) => {
     let added = false;
 
     for (const group of groups) {
@@ -63,11 +67,11 @@ const groupActivityHistoryItems = (items: IActivityHistoryItem[]): IActivityHist
   });
 
   // Crear subgrupos por diagnósticos iguales. Los items que no tienen diagnostico, se quedan fuera de subgrupos (remaining items)
-  groups.forEach(group => {
+  groups.forEach((group) => {
     const subGroups: IActivityHistorySubGroup[] = [];
     const remainingItems: IActivityHistoryItem[] = [];
 
-    group.items.forEach(item => {
+    group.items.forEach((item) => {
       if (item.diagnostics?.length > 0) {
         let addedToSubGroup = false;
 
@@ -99,4 +103,4 @@ const groupActivityHistoryItems = (items: IActivityHistoryItem[]): IActivityHist
   return groups;
 };
 
-export {groupActivityHistoryItems};
+export { groupActivityHistoryItems };

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/actions.ts

@@ -0,0 +1,4 @@
+import { activityHistoryCollectionsSlice } from "../../slice";
+
+export const { addBusyHistoryItem, removeBusyHistoryItem } =
+  activityHistoryCollectionsSlice.actions;

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/bootstrapper.ts

@@ -0,0 +1,5 @@
+import "./busy-component/component";
+
+export const bootstrapActivityHistoryItemHandleBusy = () => {
+  () => null;
+};

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/busy-component/component.ts

@@ -0,0 +1,27 @@
+import { LitElement, css, html, unsafeCSS } from "lit";
+import { customElement } from "lit/decorators.js";
+import styles from "./styles.css?inline";
+import { template } from "./template";
+import { connectedProperty } from "../../../../infrastructure/state/connected-property";
+import {
+  isAnyCollectionLoadingWithoutAnyLoaded,
+  isSomeCollectionLoadedAndOtherLoading,
+} from "../selectors";
+
+//@ts-ignore
+@customElement("activity-history-busy")
+export class ActivityHistoryBusy extends LitElement {
+  render() {
+    return html`${template(this)}`;
+  }
+
+  static styles = css`
+    ${unsafeCSS(styles)}
+  `;
+
+  @connectedProperty(isAnyCollectionLoadingWithoutAnyLoaded)
+  isAnyCollectionLoadingWithoutAnyLoaded: boolean;
+
+  @connectedProperty(isSomeCollectionLoadedAndOtherLoading)
+  isSomeCollectionLoadedAndOtherLoading: boolean;
+}

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/busy-component/styles.css

@@ -0,0 +1,15 @@
+.spinner-container {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        gap: 24px;
+        justify-content: center;
+        padding-top:16px
+      }
+      .spinner-full-container {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/busy-component/template.ts

@@ -0,0 +1,10 @@
+import { html, nothing } from "lit";
+import { ActivityHistoryBusy } from "./component";
+import { translate } from "../../../../localization";
+
+export const template = (props: ActivityHistoryBusy) =>
+  props.isAnyCollectionLoadingWithoutAnyLoaded
+    ? html`<div class="spinner-full-container"><dss-spinner></dss-spinner></div>`
+    : props.isSomeCollectionLoadedAndOtherLoading
+      ? html`<div class="spinner-container"><dss-spinner size="sm"></dss-spinner><div class="busy-description">${translate("busyEntriesLoading")}</div></div>`
+      : nothing;

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/reducers.ts

@@ -0,0 +1,8 @@
+import { PayloadAction } from "@reduxjs/toolkit";
+
+export function addBusyHistoryItemReducer(state, action: PayloadAction<string>) {
+  state.busy.push(action.payload);
+}
+export function removeBusyHistoryItemReducer(state, action: PayloadAction<string>) {
+  state.busy = state.busy.filter((i) => i !== action.payload);
+}

package/src/internal-plugins/activity-history/activity-history-item/list/handle-busy/selectors.ts

@@ -0,0 +1,13 @@
+import { RootState } from "../../../infrastructure/state/store";
+
+const isAnyCollectionBusySelector = (state: RootState) =>
+  state.activityHistoryCollections.busy.length > 0;
+export const isAnyCollectionLoadingWithoutAnyLoaded = (state: RootState) => {
+  const collections = Object.values(state.activityHistoryCollections.collections);
+  return !collections?.length && isAnyCollectionBusySelector(state);
+};
+
+export const isSomeCollectionLoadedAndOtherLoading = (state: RootState) => {
+  const collections = Object.values(state.activityHistoryCollections.collections);
+  return collections && isAnyCollectionBusySelector(state);
+};

package/src/internal-plugins/activity-history/activity-history-item/list/handle-error/actions.ts

@@ -0,0 +1,4 @@
+import { activityHistoryCollectionsSlice } from "../../slice";
+
+export const { addErrorHistoryItem, removeErrorHistoryItem } =
+  activityHistoryCollectionsSlice.actions;

package/src/internal-plugins/activity-history/activity-history-item/list/handle-error/reducers.ts

@@ -0,0 +1,6 @@
+export function addErrorHistoryItemReducer(state, action) {
+  state.error.push(action.payload);
+}
+export function removeErrorHistoryItemReducer(state, action) {
+  state.error = state.error.filter((i) => i !== action.payload);
+}

package/src/internal-plugins/activity-history/activity-history-item/list/selectors.ts

@@ -0,0 +1,62 @@
+import { createSelector } from "@reduxjs/toolkit";
+import { RootState } from "../../infrastructure/state/store";
+import { commonSpecSelector } from "../filter/selectors";
+import {
+  IActivityHistoryItem,
+  IActivityHistoryItemCollection,
+  TSearchActivityHistoryItemPredicate,
+} from "../domain/model";
+import { SearchStringSpec } from "../domain/specs/search-string-spec";
+import { groupActivityHistoryItems } from "./group-history-items/group-history-items";
+import { sortGroupsByMostRecentDate } from "./sort-history-items-by-date/sort-history-items-by-date";
+import { activityHistorySearchStringSelector } from "../search/selectors";
+import { Spec } from "../domain/specs/spec";
+
+export const activityHistoryCollectionsSelector = (state: RootState) =>
+  state.activityHistoryCollections.collections;
+
+const mapItemsWithMetadata = (
+  items: IActivityHistoryItem[],
+  componentFactory: any,
+  type: string,
+  searchPredicate: TSearchActivityHistoryItemPredicate,
+) => {
+  return items.map(
+    (item) =>
+      ({
+        ...item,
+        searchPredicate,
+        componentFactory,
+        type,
+      }) as IActivityHistoryItem,
+  );
+};
+
+export const activityHistoryMappedItems = createSelector(
+  activityHistoryCollectionsSelector,
+  (collections: Record<string, IActivityHistoryItemCollection>) => {
+    return Object.values(collections).flatMap((collection: IActivityHistoryItemCollection) => {
+      return mapItemsWithMetadata(
+        collection.items,
+        collection.componentFactory,
+        collection.id,
+        collection.searchPredicate,
+      );
+    });
+  },
+);
+
+export const activityHistoryGroupedItems = createSelector(
+  activityHistoryMappedItems,
+  activityHistorySearchStringSelector,
+  commonSpecSelector,
+  (items: IActivityHistoryItem[], searchString: string, commonSpec: Spec<IActivityHistoryItem>) => {
+    const filteredItems = items.filter((item: IActivityHistoryItem) =>
+      new SearchStringSpec(searchString, item.searchPredicate).and(commonSpec).isSatisfiedBy(item),
+    );
+
+    const groupedItems = groupActivityHistoryItems(filteredItems);
+    const sortedByMostRecentDate = sortGroupsByMostRecentDate(groupedItems);
+    return sortedByMostRecentDate;
+  },
+);

package/src/internal-plugins/activity-history/{domain → activity-history-item/list}/sort-history-items-by-date/sort-history-items-by-date.ts

@@ -1,8 +1,8 @@
-import {IActivityHistoryGroup} from '../model';
+import { IActivityHistoryGroup } from "../../domain/model";
 
 export const sortGroupsByMostRecentDate = (arr: IActivityHistoryGroup[]) => {
   // Helper function to get the most recent date from a list of items
-  const getMostRecentDate = items => {
+  const getMostRecentDate = (items) => {
     return items.reduce((latest, item) => {
       const itemDate = new Date(item.date);
       return itemDate > latest ? itemDate : latest;
@@ -10,12 +10,12 @@ export const sortGroupsByMostRecentDate = (arr: IActivityHistoryGroup[]) => {
   };
 
   // Helper function to sort items within each group or subgroup
-  const sortItemsByDate = items => {
+  const sortItemsByDate = (items) => {
     return items.sort((a, b) => new Date(b.date) - new Date(a.date));
   };
 
   // Function to get the most recent date from a group (considering its items and subgroups)
-  const getGroupMostRecentDate = group => {
+  const getGroupMostRecentDate = (group) => {
     let allDates = [];
 
     // Collect dates from group items
@@ -24,7 +24,7 @@ export const sortGroupsByMostRecentDate = (arr: IActivityHistoryGroup[]) => {
     }
 
     // Collect dates from subgroups items
-    group.subGroups.forEach(subGroup => {
+    group.subGroups.forEach((subGroup) => {
       if (subGroup.items.length > 0) {
         allDates.push(getMostRecentDate(subGroup.items));
       }
@@ -35,9 +35,9 @@ export const sortGroupsByMostRecentDate = (arr: IActivityHistoryGroup[]) => {
   };
 
   // Sort each group's items and subgroups' items by date
-  arr.forEach(group => {
+  arr.forEach((group) => {
     group.items = sortItemsByDate(group.items);
-    group.subGroups.forEach(subGroup => {
+    group.subGroups.forEach((subGroup) => {
       subGroup.items = sortItemsByDate(subGroup.items);
     });
   });

package/src/internal-plugins/activity-history/activity-history-item/remove/reducer.ts

@@ -0,0 +1,5 @@
+export function removeActivityHistoryItemReducer(state, action) {
+  /* state.collections[action.payload.id]?.items = state.collections[action.payload.id]?.items.filter(
+        (i) => i !== action.payload,
+      );   */
+}

package/src/internal-plugins/activity-history/activity-history-item/search/actions.ts

@@ -0,0 +1,3 @@
+import { activityHistoryFiltersSlice } from "../filter/slice";
+
+export const { setSearchString } = activityHistoryFiltersSlice.actions;

package/src/internal-plugins/activity-history/activity-history-item/search/activity-history-search-bar/activity-history-search-bar.ts

@@ -0,0 +1,26 @@
+import { LitElement, css, html, unsafeCSS } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import styles from "./styles.css?inline";
+import { template } from "./template";
+
+//@ts-ignore
+@customElement("activity-history-search-bar")
+export class ActivityHistorySearchBar extends LitElement {
+  render() {
+    return html`${template(this)}`;
+  }
+
+  static styles = css`
+    ${unsafeCSS(styles)}
+  `;
+
+  @property()
+  searchQuery = "";
+
+  _handleSearchChange(event) {
+    const selectedItems = event.detail || [];
+    const searchQuery = selectedItems.length > 0 ? selectedItems.join(" ") : "";
+    const payload = searchQuery.length > 1 ? searchQuery : "";
+    this.dispatchEvent(new CustomEvent("onSearchChange", { detail: payload }));
+  }
+}