@emailmaker/filemanager 0.0.3 → 0.0.5

package/file-manager.js.LICENSE.txt

@@ -4,6 +4,21 @@
 	http://jedwatson.github.io/classnames
 */
 
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation. All rights reserved.
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use
+this file except in compliance with the License. You may obtain a copy of the
+License at http://www.apache.org/licenses/LICENSE-2.0
+
+THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
+WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
+MERCHANTABLITY OR NON-INFRINGEMENT.
+
+See the Apache Version 2.0 License for specific language governing permissions
+and limitations under the License.
+***************************************************************************** */
+
 /**
  * @license
  * Lodash <https://lodash.com/>

package/helpers/files/index.d.ts

@@ -0,0 +1,2 @@
+import { File as AppFile } from '../../types';
+export declare const isImageFile: (file: AppFile) => boolean;

package/hooks/core/files/useFilesAPI.d.ts

@@ -12,5 +12,6 @@ export interface UseFilesAPIActions {
     handleAddFileByUrl: (url?: string | null, noFolder?: boolean) => Promise<AppFile | void>;
     handleDroppedFiles: (droppedFiles: globalThis.File[]) => Promise<void>;
     getFileData: (fileId: string) => Promise<Blob | undefined>;
+    uploadFileWithProvider: (file: globalThis.File) => Promise<void>;
 }
 export declare const useFilesAPI: () => UseFilesAPIActions;

package/hooks/core/useFiles.d.ts

@@ -30,6 +30,7 @@ export interface UseFilesActions {
     showCopyModal: () => void;
     handleCopyCancel: () => void;
     handleCopyOk: () => Promise<void>;
+    uploadFileWithProvider: (file: globalThis.File) => Promise<AppFile | void>;
 }
 export declare const useFiles: () => FileManagerHookBase & {
     state: UseFilesState;

package/hooks/useHybridSortAndFilter.d.ts

@@ -0,0 +1,24 @@
+import { File, FilesQueryParams, Config } from '../types';
+import { SortByType, SortOrderType } from './core/types';
+interface UseHybridSortAndFilterProps {
+    files: File[];
+    config?: Config;
+    onServerRequest?: (params: FilesQueryParams) => Promise<void>;
+}
+interface UseHybridSortAndFilterReturn {
+    processedFiles: File[];
+    handleSearch: (searchTerm: string) => void;
+    handleSort: (sortBy: SortByType, sortOrder: SortOrderType) => void;
+    handlePaginationChange: (page: number, pageSize?: number) => void;
+    isClientSideProcessing: boolean;
+}
+export declare const useHybridSortAndFilter: ({ files, config, onServerRequest, }: UseHybridSortAndFilterProps) => UseHybridSortAndFilterReturn;
+export declare const useClientSideFileProcessing: (files: File[], searchTerm: string, sortBy: SortByType, sortOrder: SortOrderType, currentPage?: number, pageSize?: number) => {
+    processedFiles: File[];
+    paginatedFiles: File[];
+    totalFiles: number;
+    totalPages: number;
+    hasNextPage: boolean;
+    hasPrevPage: boolean;
+};
+export {};

package/hooks/useNotifications.d.ts

@@ -0,0 +1,8 @@
+export declare const useNotifications: () => {
+    error: (args: import("antd").NotificationArgsProps) => void;
+    open: (args: import("antd").NotificationArgsProps) => void;
+    success: (args: import("antd").NotificationArgsProps) => void;
+    info: (args: import("antd").NotificationArgsProps) => void;
+    warning: (args: import("antd").NotificationArgsProps) => void;
+    destroy(key?: React.Key): void;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@emailmaker/filemanager",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "main": "./file-manager.js",
   "module": "./file-manager.esm.js",
   "types": "./index.d.ts",

package/sample-files.json

@@ -0,0 +1,105 @@
+{
+  "files": [
+    {
+      "id": "sample-1",
+      "name": "Красивый закат.jpg",
+      "size": "2845",
+      "date": "2024-01-15T10:30:00Z",
+      "folderId": "",
+      "type": "image",
+      "url": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=300&fit=crop",
+      "thumbnailUrl": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=150&h=100&fit=crop",
+      "extension": "jpg",
+      "isFolder": false,
+      "selected": false,
+      "dimensions": "1920x1080",
+      "aspectRatio": "16:9"
+    },
+    {
+      "id": "sample-2",
+      "name": "Горы и озеро.jpg",
+      "size": "3200",
+      "date": "2024-01-10T14:20:00Z",
+      "folderId": "nature-folder",
+      "type": "image",
+      "url": "https://images.unsplash.com/photo-1464822759380-8ed769e99d5c?w=400&h=300&fit=crop",
+      "thumbnailUrl": "https://images.unsplash.com/photo-1464822759380-8ed769e99d5c?w=150&h=100&fit=crop",
+      "extension": "jpg",
+      "isFolder": false,
+      "selected": false,
+      "dimensions": "1920x1280",
+      "aspectRatio": "3:2"
+    },
+    {
+      "id": "sample-3",
+      "name": "Отчет_2024.pdf",
+      "size": "1250",
+      "date": "2024-01-12T09:15:00Z",
+      "folderId": "documents-folder",
+      "type": "document",
+      "url": "https://via.placeholder.com/400x300/2196F3/white?text=PDF+Document",
+      "thumbnailUrl": "https://via.placeholder.com/150x100/2196F3/white?text=PDF",
+      "extension": "pdf",
+      "isFolder": false,
+      "selected": false
+    },
+    {
+      "id": "sample-4",
+      "name": "Презентация.pptx",
+      "size": "4500",
+      "date": "2024-01-08T16:45:00Z",
+      "folderId": "documents-folder",
+      "type": "document",
+      "url": "https://via.placeholder.com/400x300/FF9800/white?text=PowerPoint",
+      "thumbnailUrl": "https://via.placeholder.com/150x100/FF9800/white?text=PPT",
+      "extension": "pptx",
+      "isFolder": false,
+      "selected": false
+    },
+    {
+      "id": "sample-5",
+      "name": "Лес в тумане.jpg",
+      "size": "2100",
+      "date": "2024-01-05T11:30:00Z",
+      "folderId": "nature-folder",
+      "type": "image",
+      "url": "https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=400&h=300&fit=crop",
+      "thumbnailUrl": "https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=150&h=100&fit=crop",
+      "extension": "jpg",
+      "isFolder": false,
+      "selected": false,
+      "dimensions": "1920x1280",
+      "aspectRatio": "3:2"
+    },
+    {
+      "id": "sample-6",
+      "name": "Архивные_данные.zip",
+      "size": "15600",
+      "date": "2024-01-01T08:00:00Z",
+      "folderId": "",
+      "type": "archive",
+      "url": "https://via.placeholder.com/400x300/795548/white?text=ZIP+Archive",
+      "thumbnailUrl": "https://via.placeholder.com/150x100/795548/white?text=ZIP",
+      "extension": "zip",
+      "isFolder": false,
+      "selected": false
+    }
+  ],
+  "folders": [
+    {
+      "id": "nature-folder",
+      "name": "🌲 Природа",
+      "parentId": null
+    },
+    {
+      "id": "documents-folder", 
+      "name": "📄 Документы",
+      "parentId": null
+    },
+    {
+      "id": "photos-subfolder",
+      "name": "📷 Фотографии",
+      "parentId": "nature-folder"
+    }
+  ]
+} 

package/types.d.ts

@@ -2,6 +2,7 @@ import React, { ReactNode, RefObject } from 'react';
 import { FormInstance } from 'antd/es/form';
 import { MY_FILES, GIF, STOCK_IMAGES, AI, EDITOR } from './constants';
 import type { InputRef } from 'antd';
+import { NotificationInstance } from 'antd/es/notification/interface';
 export interface Folder {
     id: string;
     name: string;
@@ -120,6 +121,7 @@ export interface FileManagerOptions {
     publicPath?: string;
     customIcons?: CustomIcons;
     dragDropIcon?: string;
+    notification?: Partial<Omit<NotificationInstance, 'destroy'>>;
 }
 export interface FileManagerDataProviders {
     getFile: (fileId: string) => Promise<Blob>;
@@ -127,7 +129,14 @@ export interface FileManagerDataProviders {
     getFiles: (options: {
         folderId?: string;
         search?: string;
-    }) => Promise<File[]>;
+        sortBy?: SortState['sortBy'];
+        sortOrder?: SortState['sortOrder'];
+        page?: number;
+        limit?: number;
+    }) => Promise<{
+        files: File[];
+        pagination?: Partial<ApiPaginationResponse>;
+    }>;
     createFolder: (data: {
         name: string;
         parentId?: string | null;
@@ -226,6 +235,12 @@ export interface Config {
     locale?: string;
     mode?: 'fileManager' | 'imageCenter' | 'plugin';
     enabledTabs?: string[];
+    dataProcessingMode?: 'server' | 'client' | 'auto';
+    enableClientSideProcessing?: boolean;
+    staticData?: {
+        files?: File[];
+        folders?: Folder[];
+    };
     customTheme?: {
         colors?: {
             primary?: string;
@@ -265,11 +280,16 @@ export interface Config {
     /** billing page url */
     billingPageUrl?: string;
     notification?: void;
-    sendAIImageRequest?: any;
-    sseQuery?: () => Promise<void>;
+    sendAIImageRequest?: (params: object) => Promise<unknown>;
+    sseQuery?: (params: object) => void;
     customLocale?: object;
     activeLibraryItem?: LibraryMenuKey;
     fileForEdit?: string;
+    messages?: MessageType[];
+    handleLimitUsageEmitter?: {
+        fire: (args: object) => void;
+    };
+    token?: Partial<import('antd/es/theme/interface').AliasToken>;
 }
 export type LibraryMenuKey = typeof MY_FILES | typeof GIF | typeof STOCK_IMAGES | typeof AI | typeof EDITOR;
 export interface GifItem {
@@ -322,12 +342,11 @@ export interface ImageStockProps {
     customRequest: (data: string) => void;
 }
 export interface ImageAIProps {
-    setModalHeight: React.Dispatch<React.SetStateAction<string | number>>;
-    customRequest: (args: {
-        file: File;
-    }) => void;
+    customRequest: (file: {
+        file: globalThis.File;
+    }) => Promise<void | File>;
     aiTabRef: RefObject<HTMLElement>;
-    inputAiRef: RefObject<any>;
+    inputAiRef: RefObject<HTMLTextAreaElement>;
     isImageUploaded: boolean;
     setIsImageUploaded: (val: boolean) => void;
     aiImageRequest: string;
@@ -342,9 +361,9 @@ export interface ArrowProps {
     onClick?: () => void;
 }
 export interface UseImageAIGenerationProps {
-    setModalHeight: React.Dispatch<React.SetStateAction<string | number>>;
+    setFrameHeight: React.Dispatch<React.SetStateAction<string | number>>;
     customRequest: (args: {
-        file: File;
+        file: globalThis.File;
     }) => void;
     aiTabRef: React.RefObject<HTMLElement>;
     isImageUploaded: boolean;
@@ -379,4 +398,44 @@ export interface UseImageAIGenerationReturn {
     setCurrentReqId: React.Dispatch<React.SetStateAction<string | null>>;
     limitsInPlugin: boolean;
 }
+export type MessageType = {
+    status?: string;
+    images?: unknown[];
+    progress?: number;
+    data?: unknown;
+    [key: string]: unknown;
+};
+export interface FileManagerProps {
+    publicPath?: string;
+    config?: Config;
+    currentPath?: string;
+    onPathChange?: (path: string[]) => void;
+    onChangeSelection?: (files: File[]) => void;
+    searchQuery?: string;
+    sortBySize?: string;
+    dataProviders?: FileManagerDataProviders;
+    apiEndpoints?: {
+        getFolders?: string;
+        getFiles?: string;
+        createFolder?: string;
+        deleteFolder?: string;
+        addFile?: string;
+        deleteFile?: string;
+        renameFile?: string;
+        moveFile?: string;
+        updateFile?: string;
+    };
+    customIcons?: CustomIcons;
+    dragDropIcon?: string;
+    notification?: Partial<Omit<NotificationInstance, 'destroy'>>;
+}
+export interface SafeImageProps {
+    src?: string;
+    alt: string;
+    className?: string;
+    width?: number;
+    height?: number;
+    preview?: boolean;
+    file?: File;
+}
 export {};

package/utils/imageCache.d.ts

@@ -0,0 +1,10 @@
+export declare const getCachedImage: (fileId: string) => string | undefined;
+export declare const setCachedImage: (fileId: string, imageData: string) => void;
+export declare const hasCachedImage: (fileId: string) => boolean;
+export declare const getImageCacheStats: () => {
+    size: number;
+    maxSize: number;
+    cleanupBatchSize: number;
+    usage: number;
+};
+export declare const clearImageCache: () => void;

package/utils/jsonDataProvider.d.ts

@@ -0,0 +1,63 @@
+import { FileManagerDataProviders, File, Folder, Config } from '../types';
+export declare class JSONDataProvider implements FileManagerDataProviders {
+    private files;
+    private folders;
+    constructor(config?: Config);
+    loadFromJSON: (data: {
+        files?: File[];
+        folders?: Folder[];
+    }) => void;
+    loadFromURL: (url: string) => Promise<void>;
+    addFiles: (newFiles: File[]) => void;
+    addFolders: (newFolders: Folder[]) => void;
+    getFile: (fileId: string) => Promise<Blob>;
+    getFolders: () => Promise<Folder[]>;
+    getFiles: (options?: {
+        folderId?: string;
+        search?: string;
+        sortBy?: "name" | "size" | "date" | "type";
+        sortOrder?: "asc" | "desc";
+    }) => Promise<{
+        files: File[];
+        total: number;
+    }>;
+    createFolder: (data: {
+        name: string;
+        parentId?: string | null;
+    }) => Promise<Folder>;
+    deleteFolder: (folderId: string) => Promise<boolean>;
+    uploadFile: (file: {
+        name: string;
+        size: string;
+        type: string;
+        folderId?: string | null;
+        data: Blob | string;
+        thumbnail?: string;
+        dimensions?: string;
+        aspectRatio?: string;
+        extension?: string;
+    }) => Promise<File>;
+    uploadFileByUrl: (data: {
+        url: string;
+        folderId?: string | null;
+        noFolder?: boolean;
+    }) => Promise<File>;
+    deleteFile: (fileId: string) => Promise<boolean>;
+    renameFile: (fileId: string, newName: string) => Promise<File>;
+    moveItem: (options: {
+        itemId: string;
+        targetFolderId: string;
+        isFolder: boolean;
+    }) => Promise<boolean>;
+    private getFileTypeFromExtension;
+    exportToJSON: () => {
+        files: File[];
+        folders: Folder[];
+    };
+    clear: () => void;
+    getStats: () => {
+        totalFiles: number;
+        totalFolders: number;
+        filesByType: Record<string, number>;
+    };
+}

package/utils/sortHelpers.d.ts

@@ -0,0 +1,3 @@
+import { File } from '../types';
+export declare const sortFiles: (files: File[], sortBy?: "name" | "size" | "date" | "type", sortOrder?: "asc" | "desc") => File[];
+export declare const filterFiles: (files: File[], searchTerm: string) => File[];