namirasoft-account-react 1.5.0 → 1.5.2

package/src/components/quickfilter/NSAFilterBoxBase.tsx

@@ -5,6 +5,7 @@ import { QuickFilterConfig } from "./NSAQuickFilterDialog";
 export interface NSAFilterBoxBaseProps
 {
     config: QuickFilterConfig;
+    initial?: FilterItem | FilterItem[] | null;
     onChanged: (items: FilterItem | FilterItem[] | null) => void;
 }
 
@@ -53,4 +54,37 @@ export abstract class NSAFilterBoxBase<P extends NSAFilterBoxBaseProps = NSAFilt
         const sign = FilterItemOperator.getByName(config.operatorName).sign;
         return `${config.column.text} ${sign}`;
     }
+
+    protected getInitialItems(): FilterItem[]
+    {
+        const initial = this.props.initial;
+        if (!initial)
+            return [];
+        return Array.isArray(initial) ? initial : [initial];
+    }
+
+    protected getInitialValue(): string | undefined
+    {
+        return this.getInitialItems()[0]?.values[0];
+    }
+
+    protected getInitialValues(): string[]
+    {
+        return this.getInitialItems().flatMap(i => i.values);
+    }
+
+    protected getInitialBetween(): { from: string; to: string } | undefined
+    {
+        const items = this.getInitialItems();
+        if (items.length < 2)
+            return undefined;
+        const from = items.find(i => i.operator?.name === "morethanequal")?.values[0] ?? items[0].values[0];
+        const to = items.find(i => i.operator?.name === "lessthanequal")?.values[0] ?? items[1].values[0];
+        return { from, to };
+    }
+
+    protected parseDBDate(value: string): Date
+    {
+        return new Date(value.replace(" ", "T") + "Z");
+    }
 }

package/src/components/quickfilter/NSAFilterBoxBoolean.tsx

@@ -15,10 +15,21 @@ export class NSAFilterBoxBoolean extends NSAFilterBoxBase<NSAFilterBoxBaseProps,
     constructor(props: NSAFilterBoxBaseProps)
     {
         super(props);
-        this.state = { value: this.isValueless() ? false : null };
+        this.state = { value: this.resolveInitialValue() };
         this.handleChange = this.handleChange.bind(this);
     }
 
+    private resolveInitialValue(): boolean | null
+    {
+        const hasInitial = this.getInitialItems().length > 0;
+        if (this.isValueless())
+            return hasInitial;
+        const value = this.getInitialValue();
+        if (value !== undefined)
+            return value === "1";
+        return null;
+    }
+
     private isValueless(): boolean
     {
         const name = this.props.config.operatorName;
@@ -47,6 +58,7 @@ export class NSAFilterBoxBoolean extends NSAFilterBoxBase<NSAFilterBoxBaseProps,
                     required={false}
                     hideHeader={true}
                     triState={!this.isValueless()}
+                    defaultValue={this.state.value ?? undefined}
                     onChanged={e => this.handleChange(e.getValue())}
                 />
             </div>

package/src/components/quickfilter/NSAFilterBoxDate.tsx

@@ -14,7 +14,7 @@ const ENTITY_OPERATORS = ["equals"];
 
 export class NSAFilterBoxDate extends NSAFilterBoxBase<NSAFilterBoxDateProps>
 {
-    private betweenActive = false;
+    private betweenActive = this.getInitialBetween() !== undefined;
 
     private list = async (
         filters: FilterItem[] | null,
@@ -37,7 +37,9 @@ export class NSAFilterBoxDate extends NSAFilterBoxBase<NSAFilterBoxDateProps>
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
+
+        const between = this.getInitialBetween();
 
         if (config.operatorName === "between")
             return (
@@ -47,6 +49,7 @@ export class NSAFilterBoxDate extends NSAFilterBoxBase<NSAFilterBoxDateProps>
                     required={false}
                     hideHeader={true}
                     preset={true}
+                    defaultValue={between ? { from: this.parseDBDate(between.from), to: this.parseDBDate(between.to) } : undefined}
                     onChanged={e =>
                     {
                         const val = e.getValue();
@@ -75,6 +78,7 @@ export class NSAFilterBoxDate extends NSAFilterBoxBase<NSAFilterBoxDateProps>
                     required={false}
                     hideHeader={true}
                     multiple={false}
+                    defaultValue={this.getInitialValue()}
                     list={this.list}
                     table_name={config.column.table.name}
                     getValue={item => item.value}
@@ -88,12 +92,14 @@ export class NSAFilterBoxDate extends NSAFilterBoxBase<NSAFilterBoxDateProps>
                 />
             );
 
+        const single = this.getInitialValue();
         return (
             <NSBoxDate
                 title={this.getLabel()}
                 placeholder={this.getLabel()}
                 required={false}
                 hideHeader={true}
+                defaultValue={single !== undefined ? this.parseDBDate(single) : undefined}
                 onChanged={e =>
                 {
                     const val = e.getValue();

package/src/components/quickfilter/NSAFilterBoxDateTime.tsx

@@ -14,7 +14,7 @@ const ENTITY_OPERATORS = ["equals"];
 
 export class NSAFilterBoxDateTime extends NSAFilterBoxBase<NSAFilterBoxDateTimeProps>
 {
-    private betweenActive = false;
+    private betweenActive = this.getInitialBetween() !== undefined;
 
     private list = async (
         filters: FilterItem[] | null,
@@ -37,7 +37,9 @@ export class NSAFilterBoxDateTime extends NSAFilterBoxBase<NSAFilterBoxDateTimeP
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
+
+        const between = this.getInitialBetween();
 
         if (config.operatorName === "between")
             return (
@@ -47,6 +49,7 @@ export class NSAFilterBoxDateTime extends NSAFilterBoxBase<NSAFilterBoxDateTimeP
                     required={false}
                     hideHeader={true}
                     preset={true}
+                    defaultValue={between ? { from: this.parseDBDate(between.from), to: this.parseDBDate(between.to) } : undefined}
                     onChanged={e =>
                     {
                         const val = e.getValue();
@@ -75,6 +78,7 @@ export class NSAFilterBoxDateTime extends NSAFilterBoxBase<NSAFilterBoxDateTimeP
                     required={false}
                     hideHeader={true}
                     multiple={false}
+                    defaultValue={this.getInitialValue()}
                     list={this.list}
                     table_name={config.column.table.name}
                     getValue={item => item.value}
@@ -88,13 +92,14 @@ export class NSAFilterBoxDateTime extends NSAFilterBoxBase<NSAFilterBoxDateTimeP
                 />
             );
 
+        const single = this.getInitialValue();
         return (
             <NSBoxDateTime
                 title={this.getLabel()}
                 placeholder={this.getLabel()}
                 required={false}
                 hideHeader={true}
-                defaultValue={undefined}
+                defaultValue={single !== undefined ? this.parseDBDate(single) : undefined}
                 onChanged={e =>
                 {
                     const val = e.getValue();

package/src/components/quickfilter/NSAFilterBoxEnum.tsx

@@ -22,7 +22,7 @@ export class NSAFilterBoxEnum extends NSAFilterBoxBase<NSAFilterBoxEnumProps, St
     constructor(props: NSAFilterBoxEnumProps)
     {
         super(props);
-        this.state = { loading: false, values: [], selectedValues: [] };
+        this.state = { loading: false, values: [], selectedValues: this.getInitialValues() };
     }
 
     override async componentDidMount()
@@ -40,7 +40,7 @@ export class NSAFilterBoxEnum extends NSAFilterBoxBase<NSAFilterBoxEnumProps, St
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
 
         if (config.operatorName === "equals")
         {

package/src/components/quickfilter/NSAFilterBoxNumber.tsx

@@ -28,7 +28,12 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
     constructor(props: NSAFilterBoxNumberProps)
     {
         super(props);
-        this.state = { valueFrom: null, valueTo: null };
+        const between = this.getInitialBetween();
+        this.betweenActive = between !== undefined;
+        this.state = {
+            valueFrom: between ? Number(between.from) : null,
+            valueTo: between ? Number(between.to) : null,
+        };
     }
 
     private emitDebounced(value: number | null): void
@@ -81,7 +86,7 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
 
         if (config.operatorName === "between")
             return (
@@ -91,6 +96,7 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
                         placeholder={`${this.getLabel()} From`}
                         required={false}
                         hideHeader={true}
+                        defaultValue={this.state.valueFrom ?? undefined}
                         onChanged={e => this.handleBetweenChange({ valueFrom: e.getValue() })}
                     />
                     <NSBoxDouble
@@ -98,6 +104,7 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
                         placeholder={`${this.getLabel()} To`}
                         required={false}
                         hideHeader={true}
+                        defaultValue={this.state.valueTo ?? undefined}
                         onChanged={e => this.handleBetweenChange({ valueTo: e.getValue() })}
                     />
                 </NSRow>
@@ -111,6 +118,7 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
                     required={false}
                     hideHeader={true}
                     multiple={false}
+                    defaultValue={this.getInitialValue()}
                     list={this.list}
                     table_name={config.column.table.name}
                     getValue={item => item.value}
@@ -130,6 +138,7 @@ export class NSAFilterBoxNumber extends NSAFilterBoxBase<NSAFilterBoxNumberProps
                 placeholder={this.getLabel()}
                 required={false}
                 hideHeader={true}
+                defaultValue={this.getInitialValue() !== undefined ? Number(this.getInitialValue()) : undefined}
                 onChanged={e => this.emitDebounced(e.getValue())}
             />
         );

package/src/components/quickfilter/NSAFilterBoxString.tsx

@@ -46,7 +46,7 @@ export class NSAFilterBoxString extends NSAFilterBoxBase<NSAFilterBoxStringProps
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
 
         if (config.operatorName && ENTITY_OPERATORS.includes(config.operatorName))
             return (
@@ -56,6 +56,7 @@ export class NSAFilterBoxString extends NSAFilterBoxBase<NSAFilterBoxStringProps
                     required={false}
                     hideHeader={true}
                     multiple={false}
+                    defaultValue={this.getInitialValue()}
                     list={this.list}
                     table_name={config.column.table.name}
                     getValue={item => item.value}
@@ -75,6 +76,7 @@ export class NSAFilterBoxString extends NSAFilterBoxBase<NSAFilterBoxStringProps
                 placeholder={this.getLabel()}
                 required={false}
                 hideHeader={true}
+                defaultValue={this.getInitialValue()}
                 onChanged={e => this.emitDebounced(e.getValue())}
             />
         );

package/src/components/quickfilter/NSAFilterBoxTime.tsx

@@ -14,7 +14,7 @@ const ENTITY_OPERATORS = ["equals"];
 
 export class NSAFilterBoxTime extends NSAFilterBoxBase<NSAFilterBoxTimeProps>
 {
-    private betweenActive = false;
+    private betweenActive = this.getInitialBetween() !== undefined;
 
     private list = async (
         filters: FilterItem[] | null,
@@ -37,7 +37,9 @@ export class NSAFilterBoxTime extends NSAFilterBoxBase<NSAFilterBoxTimeProps>
             : null;
 
         if (op && op.count === 0)
-            return <NSAFilterBoxBoolean config={config} onChanged={onChanged} />;
+            return <NSAFilterBoxBoolean config={config} initial={this.props.initial} onChanged={onChanged} />;
+
+        const between = this.getInitialBetween();
 
         if (config.operatorName === "between")
             return (
@@ -47,6 +49,7 @@ export class NSAFilterBoxTime extends NSAFilterBoxBase<NSAFilterBoxTimeProps>
                     required={false}
                     hideHeader={true}
                     preset={true}
+                    defaultValue={between ? { from: between.from, to: between.to } : undefined}
                     onChanged={e =>
                     {
                         const val = e.getValue();
@@ -72,6 +75,7 @@ export class NSAFilterBoxTime extends NSAFilterBoxBase<NSAFilterBoxTimeProps>
                     required={false}
                     hideHeader={true}
                     multiple={false}
+                    defaultValue={this.getInitialValue()}
                     list={this.list}
                     table_name={config.column.table.name}
                     getValue={item => item.value}
@@ -91,6 +95,7 @@ export class NSAFilterBoxTime extends NSAFilterBoxBase<NSAFilterBoxTimeProps>
                 placeholder={this.getLabel()}
                 required={false}
                 hideHeader={true}
+                defaultValue={this.getInitialValue()}
                 onChanged={e =>
                 {
                     const val = e.getValue();

package/src/components/quickfilter/NSAQuickFilterBar.tsx

@@ -15,6 +15,7 @@ interface NSAQuickFilterBarProps
 {
     configs: QuickFilterConfig[];
     getValues: (tableName: string, columnName: string, search: string) => Promise<{ value: string; title: string }[]>;
+    initialItems?: FilterItem[];
     onChanged?: () => void;
 }
 
@@ -41,7 +42,33 @@ export class NSAQuickFilterBar extends Component<NSAQuickFilterBarProps, NSAQuic
     constructor(props: NSAQuickFilterBarProps)
     {
         super(props);
-        this.state = { filterValues: {}, clearKeys: {} };
+        this.state = { filterValues: this.buildInitialValues(props), clearKeys: {} };
+    }
+
+    private buildInitialValues(props: NSAQuickFilterBarProps): { [id: string]: FilterItem | FilterItem[] | null }
+    {
+        const values: { [id: string]: FilterItem | FilterItem[] | null } = {};
+        const items = props.initialItems ?? [];
+        const consumed = new Set<number>();
+        for (const config of props.configs)
+        {
+            const matched: FilterItem[] = [];
+            items.forEach((item, index) =>
+            {
+                if (consumed.has(index))
+                    return;
+                if (item.table.name === config.column.table.name && item.column.name === config.column.name)
+                {
+                    matched.push(item);
+                    consumed.add(index);
+                }
+            });
+            if (matched.length === 1)
+                values[config.id] = matched[0];
+            else if (matched.length > 1)
+                values[config.id] = matched;
+        }
+        return values;
     }
 
     getFilterItems(): FilterItem[]
@@ -65,7 +92,8 @@ export class NSAQuickFilterBar extends Component<NSAQuickFilterBarProps, NSAQuic
     {
         const { columnType } = config.column;
         const onChanged = (items: FilterItem | FilterItem[] | null) => this.handleFilterChange(config.id, items);
-        const commonProps = { key: clearKey, config, onChanged };
+        const initial = this.state.filterValues[config.id] ?? null;
+        const commonProps = { key: clearKey, config, initial, onChanged };
 
         if (columnType === VariableType.Boolean)
             return <NSAFilterBoxBoolean {...commonProps} />;

package/src/layouts/NSALayout.tsx

@@ -4,7 +4,7 @@ import { CacheService, CookieService, EnvService, FilterItem, FilterItemOperator
 import { CategoryRow, FieldRow, NamirasoftFieldMetaDatabase, NamirasoftFieldServer } from 'namirasoft-field';
 import { NamirasoftMessageServer } from 'namirasoft-message';
 import { NamirasoftMap } from 'namirasoft-site-map';
-import { IBackgroundProps, IBaseComponentProps, IHeaderIconProps, IHeaderRightProps, KeyOperation, LinkOperation, NSBarActionProps, NSBarAlertProps, NSBarTitleProps, NSDialogDelete, NSLayout, NSLoading, ProductCacheService } from 'namirasoft-site-react';
+import { IBackgroundProps, IBaseComponentProps, IHeaderIconProps, IHeaderRightProps, NSBarActionProps, NSBarAlertProps, NSBarTitleProps, NSDialogDelete, NSLayout, NSLoading, ProductCacheService } from 'namirasoft-site-react';
 import { IHeaderLeftProps } from 'namirasoft-site-react/dist/props/IHeaderLeftProps';
 import { Component, createRef } from 'react';
 import { Helmet } from 'react-helmet';
@@ -309,8 +309,6 @@ export class NSALayout<RowType extends { id: string }, RowTypeInput = RowType> e
             this.reloadMessageCount(false);
 
         client.start();
-        KeyOperation.start();
-        LinkOperation.setNavigate(this.props.url.navigate);
     }
     override componentDidUpdate(): void
     {
@@ -324,7 +322,6 @@ export class NSALayout<RowType extends { id: string }, RowTypeInput = RowType> e
     override componentWillUnmount(): void
     {
         client.stop();
-        KeyOperation.stop();
     }
     override render()
     {

package/src/pages/NSAHomePage.tsx

@@ -1,7 +1,7 @@
 import { ReactNode, useEffect, useState } from 'react';
 import { SetTimeouService } from 'namirasoft-core';
 import { ProductFullRow } from 'namirasoft-api-product';
-import { IBaseComponentProps, NSBox, NSBoxSearch, NSListProduct, NSListProductCardProps, NSLoading, NSSpace, NSSpaceSizeType, ProductCacheService } from 'namirasoft-site-react';
+import { IBaseComponentProps, NSBox, NSBoxSearch, NSLine, NSListMenu, NSListProduct, NSListProductCardProps, NSLoading, NSSpace, NSSpaceSizeType, NSTitle, ProductCacheService } from 'namirasoft-site-react';
 import { NSARouterMakerProps } from '../NSARouterMakerProps';
 import Styles from './NSAHomePage.module.css';
 
@@ -14,8 +14,12 @@ export interface NSAHomePageProps extends IBaseComponentProps, NSARouterMakerPro
         description?: string;
     };
     show_image?: boolean;
-    getChildrenBefore?: () => ReactNode;
-    getChildrenAfter?: () => ReactNode;
+    getChildren?: {
+        getChildrenBeforeTitle?: () => ReactNode;
+        getChildrenAfterTitle?: () => ReactNode;
+        getChildrenBeforeMenuList?: () => ReactNode;
+        getChildrenAfterMenuList?: () => ReactNode;
+    };
     product?: {
         search?: boolean;
         getChildrenBefore?: () => NSListProductCardProps[];
@@ -63,9 +67,13 @@ export function NSAHomePage(props: NSAHomePageProps)
                 />
             }
             <NSSpace size={NSSpaceSizeType.MICRO} />
+
+            {props.getChildren?.getChildrenBeforeTitle?.()}
             <h2>{headline}</h2>
             <NSSpace size={NSSpaceSizeType.MICRO} />
             <p>{description}</p>
+            {props.getChildren?.getChildrenAfterTitle?.()}
+
             {
                 props.product?.search &&
                 <>
@@ -89,7 +97,21 @@ export function NSAHomePage(props: NSAHomePageProps)
                 </>
             }
             <NSSpace size={NSSpaceSizeType.SMALL} />
-            {props.getChildrenBefore && props.getChildrenBefore()}
+
+            {props.getChildren?.getChildrenBeforeMenuList?.()}
+            <NSListMenu
+                scope={scope}
+                name="Header"
+                isLoggedIn={() => props.account.token_manager.exists()}
+                onError={props.notifier.onError}
+            />
+            {props.getChildren?.getChildrenAfterMenuList?.()}
+
+            <NSSpace size={NSSpaceSizeType.NORMAL} />
+            <NSLine />
+            <NSSpace size={NSSpaceSizeType.SMALL} />
+            
+            <NSTitle title="Related Products" style={{ marginBottom: 32, fontSize: 32 }} />
             <NSListProduct
                 scope={scope}
                 name="Home"
@@ -97,7 +119,6 @@ export function NSAHomePage(props: NSAHomePageProps)
                 getChildrenBefore={props.product?.getChildrenBefore}
                 getChildrenAfter={props.product?.getChildrenAfter}
             />
-            {props.getChildrenAfter && props.getChildrenAfter()}
         </div>
     );
 }