proje-react-panel 1.1.6 → 1.2.0

package/src/__tests__/utils/PreloadCacheHelper.test.ts

@@ -0,0 +1,71 @@
+import { OnPreload, OnResult, preloadCacheHelper } from '../../utils/PreloadCacheHelper';
+import { SelectPreloader } from '../../decorators/form/inputs/SelectInput';
+import { describe, expect, it, beforeEach, jest } from '@jest/globals';
+
+interface CacheMap {
+  cache: Map<SelectPreloader<unknown>, { label: string; value: unknown }[]>;
+  asyncQueue: Map<
+    SelectPreloader<unknown>,
+    ((result: { label: string; value: unknown }[]) => Promise<void>)[]
+  >;
+}
+
+describe('PreloadCacheHelper', () => {
+  beforeEach(() => {
+    // Clear the cache before each test
+    (preloadCacheHelper as unknown as CacheMap).cache = new Map();
+    (preloadCacheHelper as unknown as CacheMap).asyncQueue = new Map();
+  });
+
+  // Generated by AI
+  it('should cache and return results for the same key', async () => {
+    const mockSelectPreloaderKey = jest.fn() as SelectPreloader<number>;
+    const mockOnPreload = jest
+      .fn<OnPreload<number>>()
+      .mockResolvedValue([{ label: 'Test', value: 1 }]);
+    const mockOnResult = jest.fn<OnResult<number>>().mockImplementation(() => {
+      return Promise.resolve();
+    });
+
+    await preloadCacheHelper.setOrGetCache(mockSelectPreloaderKey, mockOnResult, mockOnPreload);
+    await preloadCacheHelper.setOrGetCache(mockSelectPreloaderKey, mockOnResult, mockOnPreload);
+
+    expect(mockSelectPreloaderKey).toHaveBeenCalledTimes(0);
+    expect(mockOnPreload).toHaveBeenCalledTimes(1);
+    expect(mockOnResult).toHaveBeenCalledTimes(2);
+  });
+
+  // Generated by AI
+  it('should handle preload errors gracefully', async () => {
+    const mockSelectPreloaderKey = jest.fn() as SelectPreloader<number>;
+    const mockOnPreload = jest
+      .fn<OnPreload<number>>()
+      .mockRejectedValue(new Error('Preload failed'));
+    const mockOnResult = jest
+      .fn<OnResult<number>>()
+      .mockImplementation(async () => Promise.resolve());
+
+    await expect(
+      preloadCacheHelper.setOrGetCache(mockSelectPreloaderKey, mockOnResult, mockOnPreload)
+    ).rejects.toThrow('Preload failed');
+
+    expect(mockOnResult).not.toHaveBeenCalled();
+  });
+
+  // Generated by AI
+  it('should clear async queue after successful preload', async () => {
+    const mockSelectPreloaderKey = jest.fn() as SelectPreloader<number>;
+    const mockOnPreload = jest
+      .fn<OnPreload<number>>()
+      .mockResolvedValue([{ label: 'Test', value: 1 }]);
+    const mockOnResult = jest
+      .fn<OnResult<number>>()
+      .mockImplementation(async () => Promise.resolve());
+
+    await preloadCacheHelper.setOrGetCache(mockSelectPreloaderKey, mockOnResult, mockOnPreload);
+
+    expect((preloadCacheHelper as unknown as CacheMap).asyncQueue.has(mockSelectPreloaderKey)).toBe(
+      false
+    );
+  });
+});

package/src/components/form/FormField.tsx

@@ -54,15 +54,31 @@ function NestedFormFields({ input, register }: NestedFormFieldsProps) {
 
 export function FormField({ input, register, error, baseName }: FormFieldProps) {
   const fieldName: string = (baseName ? baseName.toString() + '.' : '') + input.name || '';
+  //TODO: support rest default values
   const renderField = () => {
     switch (input.type) {
       case 'textarea':
-        return <textarea {...register(fieldName)} placeholder={input.placeholder} />;
+        return (
+          <textarea
+            defaultValue={input.defaultValue}
+            {...register(fieldName, {
+              value: input.defaultValue,
+            })}
+            placeholder={input.placeholder}
+          />
+        );
       case 'select':
         return <Select input={input} fieldName={fieldName} />;
       case 'input': {
         return (
-          <input type={input.inputType} {...register(fieldName)} placeholder={input.placeholder} />
+          <input
+            type={input.inputType}
+            defaultValue={input.defaultValue}
+            {...register(fieldName, {
+              value: input.defaultValue,
+            })}
+            placeholder={input.placeholder}
+          />
         );
       }
       case 'file-upload':

package/src/components/form/Select.tsx

@@ -23,6 +23,7 @@ export function Select<TValue>({ input, fieldName }: SelectProps) {
   const styles = useMemo(() => darkSelectStyles<TValue>(), []);
   useEffect(() => {
     if (inputSelect.onSelectPreloader) {
+      const
       inputSelect.onSelectPreloader().then(option => {
         setOptions(option);
       });

package/src/decorators/form/Input.ts

@@ -17,6 +17,7 @@ export interface InputOptions {
   label?: string;
   placeholder?: string;
   nestedFields?: InputConfiguration[];
+  defaultValue?: string;
   includeInCSV?: boolean;
   includeInJSON?: boolean;
 }
@@ -32,6 +33,7 @@ export interface InputConfiguration {
   label?: string;
   placeholder?: string;
   nestedFields?: InputConfiguration[];
+  defaultValue?: string;
   includeInCSV: boolean;
   includeInJSON: boolean;
 }

package/src/decorators/form/inputs/SelectInput.ts

@@ -1,15 +1,19 @@
 import { ExtendedInput, ExtendedInputOptions, InputConfiguration, InputOptions } from '../Input';
 
+export type SelectPreloader<T> = () => Promise<{ label: string; value: T }[]>;
 export interface SelectInputOptions<T> extends InputOptions {
-  onSelectPreloader?: () => Promise<{ label: string; value: T }[]>;
+  onSelectPreloader?: SelectPreloader<T>;
   defaultOptions?: { value: T; label: string }[];
   csvExport?: never;
+  defaultValue?: never;
 }
 
 export interface SelectInputConfiguration<T> extends InputConfiguration {
   type: 'select';
-  onSelectPreloader?: () => Promise<{ label: string; value: T }[]>;
+  onSelectPreloader?: SelectPreloader<T>;
   defaultOptions?: { value: T; label: string }[];
+  csvExport?: never;
+  defaultValue?: never;
 }
 
 export function SelectInput<K>(options?: SelectInputOptions<K>): PropertyDecorator {

package/src/utils/PreloadCacheHelper.ts

@@ -0,0 +1,54 @@
+import { SelectPreloader } from '../decorators/form/inputs/SelectInput';
+
+export type OnResult<T> = (result: { label: string; value: T }[]) => Promise<void>;
+export type OnPreload<T> = () => Promise<{ label: string; value: T }[]>;
+
+class PreloadCacheHelper {
+  private static instance: PreloadCacheHelper;
+  private cache: Map<SelectPreloader<unknown>, { label: string; value: unknown }[]>;
+  private asyncQueue: Map<
+    SelectPreloader<unknown>,
+    ((result: { label: string; value: unknown }[]) => Promise<void>)[]
+  >;
+
+  private constructor() {
+    this.cache = new Map();
+  }
+
+  public async setOrGetCache<T>(
+    key: SelectPreloader<T>,
+    onResult: OnResult<T>,
+    onPreload: OnPreload<T>
+  ): Promise<void> {
+    if (this.cache.has(key)) {
+      onResult(this.cache.get(key) as { label: string; value: T }[]);
+      return;
+    }
+    if (this.asyncQueue.get(key) === undefined) {
+      this.asyncQueue.set(key, []);
+    }
+    const length = this.asyncQueue.get(key)!.length;
+    if (!this.asyncQueue.get(key)!.includes(onResult as OnResult<unknown>)) {
+      this.asyncQueue.get(key)?.push(onResult as OnResult<unknown>);
+    } else {
+      return;
+    }
+    if (length > 0) {
+      return;
+    }
+
+    const result = await onPreload();
+    this.cache.set(key, result);
+    this.asyncQueue.get(key)?.forEach(onResult => onResult(result));
+    this.asyncQueue.delete(key);
+  }
+
+  public static getInstance() {
+    if (!PreloadCacheHelper.instance) {
+      PreloadCacheHelper.instance = new PreloadCacheHelper();
+    }
+    return PreloadCacheHelper.instance;
+  }
+}
+
+export const preloadCacheHelper = PreloadCacheHelper.getInstance();