@webiny/app-admin 5.23.1 → 5.24.0-beta.0

package/components/FileManager/LeftSidebar.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="react" />
-declare function LeftSidebar({ toggleTag, queryParams: { tags } }: {
-    toggleTag: any;
+import React from "react";
+interface LeftSidebarProps {
+    toggleTag: (item: string) => void;
     queryParams: {
-        tags: any;
+        tags: string[];
     };
-}): JSX.Element;
+}
+declare const LeftSidebar: React.FC<LeftSidebarProps>;
 export default LeftSidebar;

package/components/FileManager/LeftSidebar.js

@@ -54,9 +54,9 @@ var Tag = /*#__PURE__*/styled("div", {
   }
 });
 
-function LeftSidebar(_ref) {
-  var toggleTag = _ref.toggleTag,
-      tags = _ref.queryParams.tags;
+var LeftSidebar = function LeftSidebar(props) {
+  var toggleTag = props.toggleTag,
+      tags = props.queryParams.tags;
   var activeTags = Array.isArray(tags) ? tags : [];
 
   var _useQuery = useQuery(LIST_TAGS),
@@ -90,6 +90,6 @@ function LeftSidebar(_ref) {
       icon: /*#__PURE__*/React.createElement(TagIcon, null)
     }), " ", item);
   })));
-}
+};
 
 export default LeftSidebar;

package/components/FileManager/NoPermissionView.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare const NoPermissionView: () => JSX.Element;
+import React from "react";
+declare const NoPermissionView: React.FC;
 export default NoPermissionView;

package/components/FileManager/NoResults.d.ts

@@ -1,2 +1,3 @@
-/// <reference types="react" />
-export default function DropFilesHere(): JSX.Element;
+import React from "react";
+declare const DropFilesHere: React.FC;
+export default DropFilesHere;

package/components/FileManager/NoResults.js

@@ -6,8 +6,11 @@ var styles = /*#__PURE__*/css({
   position: "absolute",
   width: "100%"
 }, "label:styles;");
-export default function DropFilesHere() {
+
+var DropFilesHere = function DropFilesHere() {
   return /*#__PURE__*/React.createElement("div", {
     className: styles
   }, /*#__PURE__*/React.createElement("div", null, "No results found."));
-}
+};
+
+export default DropFilesHere;

package/components/FileManager/getFileTypePlugin.d.ts

@@ -1 +1,4 @@
-export default function getFileTypePlugin(file: any): any;
+import { AdminFileManagerFileTypePlugin } from "../../types";
+import { FileManagerFileTypePlugin } from "../../plugins/FileManagerFileTypePlugin";
+import { FileItem } from "./types";
+export default function getFileTypePlugin(file: FileItem): AdminFileManagerFileTypePlugin | FileManagerFileTypePlugin;

package/components/FileManager/getFileTypePlugin.js

@@ -9,6 +9,11 @@ export default function getFileTypePlugin(file) {
   }
 
   var fileTypePlugins = [].concat(_toConsumableArray(plugins.byType("admin-file-manager-file-type")), _toConsumableArray(plugins.byType(FileManagerFileTypePlugin.type)));
+  /**
+   * TODO: if we are searching last available plugin, we can refactor this.
+   * TODO: check out @pavel
+   */
+
   var plugin = null;
 
   for (var i = 0; i < fileTypePlugins.length; i++) {

package/components/FileManager/getFileUploader.d.ts

@@ -1,2 +1,3 @@
-declare const _default: () => (file: File, options: import("@webiny/app/types").UploadOptions) => Promise<any>;
+import { AppFileManagerStoragePlugin } from "@webiny/app/types";
+declare const _default: () => AppFileManagerStoragePlugin["upload"];
 export default _default;

package/components/FileManager/outputFileSelectionError.d.ts

@@ -1,2 +1,5 @@
-declare const _default: (errors: any) => string;
+declare const _default: (errors: Record<string, any>[]) => string | null;
+/**
+ * Figure out correct types for the errors.
+ */
 export default _default;

package/components/FileManager/outputFileSelectionError.js

@@ -1,4 +1,9 @@
 import bytes from "bytes";
+/**
+ * Figure out correct types for the errors.
+ */
+// TODO @ts-refactor
+
 export default (function (errors) {
   if (errors.length > 1) {
     var error = errors.find(function (error) {

package/components/FileManager/types.d.ts

@@ -0,0 +1,49 @@
+export interface FileItem {
+    id: string;
+    name: string;
+    key: string;
+    src: string;
+    size: number;
+    type: string;
+    tags: string[];
+    createdOn: string;
+    createdBy: {
+        id: string;
+    };
+    [key: string]: any;
+}
+export interface CreateFileResponse {
+    fileManager: {
+        createFile: {
+            data: FileItem;
+            error?: Error | null;
+        };
+    };
+}
+export interface UpdateFileResponse {
+    fileManager: {
+        updateFile: {
+            data: FileItem;
+            error?: Error | null;
+        };
+    };
+}
+export interface ListFilesResponse {
+    fileManager: {
+        listFiles: {
+            data: FileItem[];
+            error?: Error | null;
+            meta: {
+                hasMoreItems: boolean;
+                totalItem: number;
+                cursor: string | null;
+            };
+        };
+    };
+}
+export interface ListFileTagsResponse {
+    fileManager: {
+        listTags: string[];
+        error: Error | null;
+    };
+}

package/components/FileManager/types.js

@@ -0,0 +1 @@
+export {};

package/components/FileManager.d.ts

@@ -1,18 +1,23 @@
-import * as React from "react";
-declare type FileManagerProps = {
-    onChange?: Function;
+import React from "react";
+import { FileItem } from "./FileManager/types";
+export interface ShowFileManagerCallable {
+    (onChange?: (file?: FileItem | FileItem[]) => void): void;
+}
+export interface FileManagerPropsChildren {
+    showFileManager: ShowFileManagerCallable;
+}
+export interface FileManagerProps {
+    onChange?: (files: FileItem[] | FileItem) => void;
     onChangePick?: string[];
     images?: boolean;
     multiple?: boolean;
     accept?: Array<string>;
-    children: ({ showFileManager: Function }: {
-        showFileManager: any;
-    }) => React.ReactNode;
+    children: (params: FileManagerPropsChildren) => React.ReactNode;
     maxSize?: number | string;
     multipleMaxCount?: number;
     multipleMaxSize?: number | string;
     onClose?: Function;
-    onUploadCompletion?: Function;
-};
-export declare function FileManager({ children, ...rest }: FileManagerProps): JSX.Element;
-export {};
+    onUploadCompletion?: (files: FileItem[]) => void;
+}
+export declare type FileManagerPortalProps = Omit<FileManagerProps, "children">;
+export declare const FileManager: React.FC<FileManagerProps>;

package/components/FileManager.js

@@ -8,15 +8,11 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _createSuper from "@babel/runtime/helpers/createSuper";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children"];
-import * as React from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
 import ReactDOM from "react-dom";
 import FileManagerView from "./FileManager/FileManagerView";
 import pick from "lodash/pick";
 import { FileManagerProvider } from "./FileManager/FileManagerContext";
-var useState = React.useState,
-    useRef = React.useRef,
-    useCallback = React.useCallback,
-    useEffect = React.useEffect;
 
 var FileManagerPortal = /*#__PURE__*/function (_React$Component) {
   _inherits(FileManagerPortal, _React$Component);
@@ -67,15 +63,22 @@ var FileManagerPortal = /*#__PURE__*/function (_React$Component) {
       var container = this.container;
 
       var handleFileOnChange = function handleFileOnChange(files) {
+        if (!files || files.length === 0) {
+          return;
+        }
+
         var fields = Array.isArray(onChangePick) ? onChangePick : ["id", "name", "key", "src", "size", "type"];
 
-        if (Array.isArray(files)) {
-          onChange(files.map(function (file) {
+        if (Array.isArray(files) === true) {
+          var items = files.map(function (file) {
             return pick(file, fields);
-          }));
-        } else {
-          onChange(pick(files, fields));
+          });
+          onChange(items);
+          return;
         }
+
+        var file = pick(files, fields);
+        onChange(file);
       };
 
       var props = {
@@ -101,7 +104,7 @@ var FileManagerPortal = /*#__PURE__*/function (_React$Component) {
   return FileManagerPortal;
 }(React.Component);
 
-export function FileManager(_ref) {
+export var FileManager = function FileManager(_ref) {
   var children = _ref.children,
       rest = _objectWithoutProperties(_ref, _excluded);
 
@@ -130,4 +133,4 @@ export function FileManager(_ref) {
   })), children({
     showFileManager: showFileManager
   }));
-}
+};

package/components/FloatingActionButton.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare const FloatingActionButton: (props: any) => JSX.Element;
+import * as React from "react";
+declare const FloatingActionButton: React.FC;
 export { FloatingActionButton };

package/components/MultiImageUpload.d.ts

@@ -1,4 +1,13 @@
-/// <reference types="react" />
-declare type Props = any;
-export default function MultiImageUpload({ imagePreviewProps, ...multiImageUploadProps }: Props): JSX.Element;
-export {};
+import * as React from "react";
+/**
+ * TODO @ts-refactor
+ */
+interface Props {
+    imagePreviewProps: {
+        src: string;
+        [key: string]: any;
+    };
+    [key: string]: any;
+}
+declare const MultiImageUpload: React.FC<Props>;
+export default MultiImageUpload;

package/components/MultiImageUpload.js

@@ -2,13 +2,22 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["imagePreviewProps"];
 import * as React from "react";
 import { Image } from "@webiny/app/components/Image";
-import { MultiImageUpload as UiMultiImageUpload } from "@webiny/ui/ImageUpload"; // TODO: @adrian define props type
+import { MultiImageUpload as UiMultiImageUpload } from "@webiny/ui/ImageUpload";
+/**
+ * TODO @ts-refactor
+ */
 
-export default function MultiImageUpload(_ref) {
+var MultiImageUpload = function MultiImageUpload(_ref) {
   var imagePreviewProps = _ref.imagePreviewProps,
       multiImageUploadProps = _objectWithoutProperties(_ref, _excluded);
 
-  return /*#__PURE__*/React.createElement(UiMultiImageUpload, Object.assign({
+  return /*#__PURE__*/React.createElement(UiMultiImageUpload
+  /**
+   * TODO @ts-refactor
+   * It appers that renderImagePreview does not exist on  UiMultiImageUpload. So how did this work?
+   */
+  // @ts-ignore
+  , Object.assign({
     renderImagePreview: function renderImagePreview(renderImageProps) {
       return /*#__PURE__*/React.createElement(Image, Object.assign({
         transform: {
@@ -17,4 +26,6 @@ export default function MultiImageUpload(_ref) {
       }, imagePreviewProps, renderImageProps));
     }
   }, multiImageUploadProps));
-}
+};
+
+export default MultiImageUpload;

package/components/OverlayLayout/OverlayLayout.d.ts

@@ -1,23 +1,20 @@
 import * as React from "react";
-declare type OverlayLayoutProps = {
+import { ExitHandler } from "react-transition-group/Transition";
+interface OverlayLayoutProps {
     barMiddle?: React.ReactNode;
     barLeft?: React.ReactNode;
     barRight?: React.ReactNode;
     children: React.ReactNode;
-    onExited?: Function;
+    onExited?: ExitHandler<HTMLElement>;
     style?: React.CSSProperties;
-};
-declare type State = {
+}
+interface State {
     isVisible: boolean;
-};
+}
 export declare class OverlayLayout extends React.Component<OverlayLayoutProps, State> {
-    constructor(props: any);
-    static defaultProps: {
-        onExited: any;
-    };
-    state: {
-        isVisible: boolean;
-    };
+    constructor(props: OverlayLayoutProps);
+    static defaultProps: Partial<OverlayLayoutProps>;
+    state: State;
     hideComponent(): void;
     componentWillUnmount(): void;
     render(): JSX.Element;

package/components/Permissions/StyledComponents.d.ts

@@ -1,6 +1,8 @@
-/// <reference types="react" />
+import React from "react";
 export declare const flexClass: string;
 export declare const gridNoPaddingClass: string;
-export declare const PermissionInfo: ({ title }: {
-    title: any;
-}) => JSX.Element;
+interface Props {
+    title: string;
+}
+export declare const PermissionInfo: React.FC<Props>;
+export {};

package/components/RichTextEditor/RichTextEditor.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from "react";
 import { RichTextEditorProps } from "@webiny/ui/RichTextEditor";
-export declare const RichTextEditor: (props: RichTextEditorProps) => JSX.Element;
+export declare const RichTextEditor: React.FC<RichTextEditorProps>;

package/components/RichTextEditor/tools/header/index.d.ts

@@ -1,21 +1,25 @@
-import { API } from "@editorjs/editorjs";
+import { HTMLPasteEvent } from "@editorjs/editorjs";
 import { TextAlign, Alignment } from "../utils";
-declare type Typography = {
+interface Typography {
     [key: string]: {
         label: string;
         component: string;
         className: string;
     };
-};
-declare type HeaderData = {
+}
+export interface HeaderData {
     text: string;
-    level: any;
-    textAlign: TextAlign;
-};
-declare type HeaderConfig = {
+    level: number;
+    textAlign?: TextAlign;
+    alignment?: Alignment;
+    className?: string;
+}
+interface HeaderConfig {
     levels: number[];
     typography: Typography;
-};
+    placeholder?: string;
+    defaultLevel?: number;
+}
 interface HeaderArgs {
     data: HeaderData;
     config: HeaderConfig;
@@ -23,15 +27,15 @@ interface HeaderArgs {
     readOnly: boolean;
 }
 declare class Header {
-    api: API;
-    readOnly: boolean;
-    settingsButtons: any[];
-    _CSS: any;
-    _settings: any;
-    _data: any;
-    _element: any;
-    alignments: Alignment[];
-    typography: Typography;
+    private readonly api;
+    private readonly readOnly;
+    private readonly settingsButtons;
+    private readonly _CSS;
+    private readonly _settings;
+    private _data;
+    private _element;
+    private readonly alignments;
+    private readonly typography;
     /**
      * Render plugin`s main Element and fill it with saved data
      *
@@ -50,7 +54,7 @@ declare class Header {
      * @returns {HeaderData}
      * @private
      */
-    normalizeData(data: any): any;
+    normalizeData(data: Partial<HeaderData>): HeaderData;
     /**
      * Return Tool's view
      *
@@ -69,13 +73,13 @@ declare class Header {
      *
      * @param {number} level - level to set
      */
-    setLevel(level: any): void;
+    setLevel(level: number): void;
     /**
      * Callback for Block's settings buttons
      *
      * @param {number} alignment - level to set
      */
-    setAlignment(alignment: any): void;
+    setAlignment(alignment: Alignment): void;
     /**
      * Method that specified how to merge two Text blocks.
      * Called by Editor.js by backspace at the beginning of the Block
@@ -83,7 +87,7 @@ declare class Header {
      * @param {HeaderData} data - saved data to merger with current block
      * @public
      */
-    merge(data: any): void;
+    merge(data: HeaderData): void;
     /**
      * Validate Text block data:
      * - check for emptiness
@@ -92,7 +96,7 @@ declare class Header {
      * @returns {boolean} false if saved data is not correct, otherwise true
      * @public
      */
-    validate(blockData: any): boolean;
+    validate(blockData: HeaderData): boolean;
     /**
      * Extract Tool's data from the view
      *
@@ -100,19 +104,14 @@ declare class Header {
      * @returns {HeaderData} - saved data
      * @public
      */
-    save(toolsContent: any): {
-        text: any;
-        level: number;
-        textAlign: TextAlign.START;
-        className: any;
-    };
+    save(toolsContent: HTMLHeadingElement): HeaderData;
     /**
      * Extract textAlign from className
      *
      * @param {string} className - heading element className
      * @returns {TextAlign} textAlign
      */
-    getTextAlign(className: any): TextAlign.START;
+    getTextAlign(className: string): TextAlign;
     /**
      * Allow Header to be converted to/from other blocks
      */
@@ -139,7 +138,7 @@ declare class Header {
      * @returns {HeaderData} Current data
      * @private
      */
-    get data(): any;
+    get data(): HeaderData;
     /**
      * Store data in plugin:
      * - at the this._data property
@@ -148,7 +147,7 @@ declare class Header {
      * @param {HeaderData} data — data to set
      * @private
      */
-    set data(data: any);
+    set data(data: HeaderData);
     /**
      * Get tag for target level
      * By default returns second-leveled header
@@ -201,9 +200,9 @@ declare class Header {
     /**
      * Handle H1-H6 tags on paste to substitute it with header Tool
      *
-     * @param {PasteEvent} event - event with pasted content
+     * @param {HTMLPasteEvent} event - event with pasted content
      */
-    onPaste(event: any): void;
+    onPaste(event: HTMLPasteEvent): void;
     /**
      * Used by Editor.js paste handling API.
      * Provides configuration to handle H1-H6 tags.

package/components/RichTextEditor/tools/header/index.js

@@ -288,12 +288,11 @@ var Header = /*#__PURE__*/function () {
   }, {
     key: "merge",
     value: function merge(data) {
-      var newData = {
+      this.data = {
         text: this.data.text + data.text,
         level: this.data.level,
         alignment: this.data.alignment
       };
-      this.data = newData;
     }
     /**
      * Validate Text block data:
@@ -607,7 +606,7 @@ var Header = /*#__PURE__*/function () {
     /**
      * Handle H1-H6 tags on paste to substitute it with header Tool
      *
-     * @param {PasteEvent} event - event with pasted content
+     * @param {HTMLPasteEvent} event - event with pasted content
      */
 
   }, {

package/components/RichTextEditor/tools/image/index.d.ts

@@ -1,3 +1,30 @@
+import { API } from "@editorjs/editorjs";
+import { Tune } from "./types";
+interface File {
+    src: string;
+}
+interface GetFileSourceCallable {
+    (file: File | string): string;
+}
+interface OnSelectFileCallable {
+    (file: File): string;
+}
+interface ImageToolData {
+    caption: string;
+    file: string;
+}
+interface ImageToolParams {
+    data: ImageToolData;
+    config: Config;
+    api: API;
+    readOnly: boolean;
+}
+interface Config {
+    getFileSrc: GetFileSourceCallable;
+    onSelectFile: OnSelectFileCallable;
+    actions: Tune[];
+    context: Record<string, any>;
+}
 export default class ImageTool {
     private readonly api;
     private readonly readOnly;
@@ -22,12 +49,7 @@ export default class ImageTool {
         icon: string;
         title: string;
     };
-    constructor({ data, config, api, readOnly }: {
-        data: any;
-        config: any;
-        api: any;
-        readOnly: any;
-    });
+    constructor({ data, config, api, readOnly }: ImageToolParams);
     /**
      * Renders Block content
      *
@@ -43,7 +65,7 @@ export default class ImageTool {
      *
      * @returns {ImageToolData}
      */
-    save(): any;
+    save(): ImageToolData;
     /**
      * Makes buttons with tunes: stretch image
      *
@@ -51,7 +73,7 @@ export default class ImageTool {
      *
      * @returns {Element}
      */
-    renderSettings(): any;
+    renderSettings(): HTMLElement;
     /**
      * Stores all Tool's data
      *
@@ -59,7 +81,7 @@ export default class ImageTool {
      *
      * @param {ImageToolData} data - data in Image Tool format
      */
-    set data(data: any);
+    set data(data: ImageToolData);
     /**
      * Return Tool data
      *
@@ -67,7 +89,7 @@ export default class ImageTool {
      *
      * @returns {ImageToolData}
      */
-    get data(): any;
+    get data(): ImageToolData;
     /**
      * Set new image file
      *
@@ -75,7 +97,7 @@ export default class ImageTool {
      *
      * @param {object} file - uploaded file data
      */
-    set image(file: any);
+    set image(file: File | string);
     /**
      * Callback fired when Block Tune is activated
      *
@@ -84,7 +106,7 @@ export default class ImageTool {
      * @param {string} tuneName - tune that has been clicked
      * @returns {void}
      */
-    tuneToggled(tuneName: any): void;
+    tuneToggled(tuneName: string): void;
     /**
      * Set one tune
      *
@@ -92,6 +114,7 @@ export default class ImageTool {
      * @param {boolean} value - tune state
      * @returns {void}
      */
-    setTune(tuneName: any, value: any): void;
+    setTune(tuneName: string, value: boolean): void;
     isReadOnly(): boolean;
 }
+export {};

package/components/RichTextEditor/tools/image/index.js

@@ -158,8 +158,10 @@ var ImageTool = /*#__PURE__*/function () {
       this._data.caption = data.caption || "";
       this.ui.fillCaption(this._data.caption);
       Tunes.tunes.forEach(function (_ref2) {
-        var tune = _ref2.name;
-        var value = typeof data[tune] !== "undefined" ? data[tune] === true || data[tune] === "true" : false;
+        var name = _ref2.name;
+        var tune = name;
+        var initialValue = data[tune];
+        var value = initialValue === true || initialValue === "true";
 
         _this2.setTune(tune, value);
       });