@uppy/dashboard - npm Package Compare versions

Comparing version 4.0.1 to 4.0.2

CHANGELOG.md

 # @uppy/dashboard
 
+## 4.0.2
+
+Released: 2024-07-30
+Included in: Uppy v4.1.0
+
+- @uppy/dashboard: make `toggleAddFilesPanel` args consistent (Evgenia Karunus / #5365)
+- @uppy/dashboard: Dashboard - convert some files to typescript (Evgenia Karunus / #5359)
+
 ## 4.0.1
@@ -4,0 +12,0 @@

lib/components/Dashboard.js

@@ -138,7 +138,5 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
     id: props.id,
-    error: props.error,
     i18n: props.i18n,
     uppy: props.uppy,
     files: props.files,
-    acquirers: props.acquirers,
     resumableUploads: props.resumableUploads,
@@ -150,3 +148,2 @@ hideRetryButton: props.hideRetryButton,
     showRemoveButtonAfterComplete: props.showRemoveButtonAfterComplete,
-    isWide: props.isWide,
     metaFields: props.metaFields,
@@ -162,3 +159,5 @@ toggleFileCard: props.toggleFileCard,
     isSingleFile: isSingleFile,
-    itemsPerRow: itemsPerRow
+    itemsPerRow: itemsPerRow,
+    containerWidth: props.containerWidth,
+    containerHeight: props.containerHeight
   })
@@ -165,0 +164,0 @@ // eslint-disable-next-line react/jsx-props-no-spreading

lib/components/FileItem/Buttons/index.d.ts

@@ -1,5 +0,20 @@
-import { type ComponentChild } from 'preact';
-type $TSFixMe = any;
-export default function Buttons(props: $TSFixMe): ComponentChild;
+import { h } from 'preact';
+import type { Body, Meta, UppyFile } from '@uppy/utils/lib/UppyFile';
+import type Uppy from '@uppy/core';
+import type { I18n } from '@uppy/utils/lib/Translator';
+import type { DashboardState } from '../../../Dashboard.js';
+type ButtonsProps<M extends Meta, B extends Body> = {
+    uppy: Uppy<M, B>;
+    file: UppyFile<M, B>;
+    i18n: I18n;
+    uploadInProgressOrComplete: boolean;
+    canEditFile: (file: UppyFile<M, B>) => boolean;
+    metaFields: DashboardState<M, B>['metaFields'];
+    showLinkToFileUploadResult: boolean;
+    showRemoveButton: boolean;
+    toggleFileCard: (show: boolean, fileId: string) => void;
+    openFileEditor: (file: UppyFile<M, B>) => void;
+};
+export default function Buttons<M extends Meta, B extends Body>(props: ButtonsProps<M, B>): h.JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

lib/components/FileItem/Buttons/index.js

@@ -78,16 +78,18 @@ import { h } from 'preact';
 }
-const copyLinkToClipboard = (event, props) => {
-  copyToClipboard(props.file.uploadURL, props.i18n('copyLinkToClipboardFallback')).then(() => {
-    props.uppy.log('Link copied to clipboard.');
-    props.uppy.info(props.i18n('copyLinkToClipboardSuccess'), 'info', 3000);
-  }).catch(props.uppy.log)
-  // avoid losing focus
-  .then(() => event.target.focus({
-    preventScroll: true
-  }));
-};
-function CopyLinkButton(props) {
-  const {
+function CopyLinkButton(_ref3) {
+  let {
+    file,
+    uppy,
     i18n
-  } = props;
+  } = _ref3;
+  const copyLinkToClipboard = event => {
+    copyToClipboard(file.uploadURL, i18n('copyLinkToClipboardFallback')).then(() => {
+      uppy.log('Link copied to clipboard.');
+      uppy.info(i18n('copyLinkToClipboardSuccess'), 'info', 3000);
+    }).catch(uppy.log)
+    // avoid losing focus
+    .then(() => event.target.focus({
+      preventScroll: true
+    }));
+  };
   return h("button", {
@@ -98,3 +100,3 @@ className: "uppy-u-reset uppy-Dashboard-Item-action uppy-Dashboard-Item-action--copyLink",
     title: i18n('copyLink'),
-    onClick: event => copyLinkToClipboard(event, props)
+    onClick: event => copyLinkToClipboard(event)
   }, h("svg", {
@@ -147,5 +149,4 @@ "aria-hidden": "true",
     file: file,
-    uppy: uppy,
-    onClick: () => uppy.removeFile(file.id, 'removed-by-user')
+    onClick: () => uppy.removeFile(file.id)
   }) : null);
 }

lib/components/FileItem/FileInfo/index.d.ts

@@ -1,5 +0,17 @@
-import { type ComponentChild } from 'preact';
-type $TSFixMe = any;
-export default function FileInfo(props: $TSFixMe): ComponentChild;
+import { h } from 'preact';
+import type { I18n } from '@uppy/utils/lib/Translator';
+import type { UppyFile } from '@uppy/core';
+import type { DashboardState } from '../../../Dashboard.js';
+type FileInfoProps = {
+    file: UppyFile<any, any>;
+    containerWidth: number;
+    containerHeight: number;
+    i18n: I18n;
+    toggleAddFilesPanel: (show: boolean) => void;
+    toggleFileCard: (show: boolean, fileId: string) => void;
+    metaFields: DashboardState<any, any>['metaFields'];
+    isSingleFile: boolean;
+};
+export default function FileInfo(props: FileInfoProps): h.JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

lib/components/FileItem/FileInfo/index.js

 /* eslint-disable react/destructuring-assignment */
-import { h, Fragment } from 'preact';
+import { h } from 'preact';
 import prettierBytes from '@transloadit/prettier-bytes';
@@ -55,3 +55,3 @@ import truncateString from '@uppy/utils/lib/truncateString';
   type: "button",
-  onClick: props.toggleAddFilesPanel
+  onClick: () => props.toggleAddFilesPanel(true)
 }, props.i18n('reSelect')));
@@ -77,3 +77,10 @@ const ErrorButton = _ref => {
   const {
-    file
+    file,
+    i18n,
+    toggleFileCard,
+    metaFields,
+    toggleAddFilesPanel,
+    isSingleFile,
+    containerHeight,
+    containerWidth
   } = props;
@@ -85,15 +92,26 @@ return h("div", {
     className: "uppy-Dashboard-Item-fileName"
-  }, renderFileName(props), h(ErrorButton, {
-    file: props.file
-    // eslint-disable-next-line no-alert
-    ,
-    onClick: () => alert(props.file.error) // TODO: move to a custom alert implementation
+  }, renderFileName({
+    file,
+    isSingleFile,
+    containerHeight,
+    containerWidth
+  }), h(ErrorButton, {
+    file: file,
+    onClick: () => alert(file.error)
   })), h("div", {
     className: "uppy-Dashboard-Item-status"
-  }, renderAuthor(props), renderFileSize(props), ReSelectButton(props)), h(MetaErrorMessage, {
-    file: props.file,
-    i18n: props.i18n,
-    toggleFileCard: props.toggleFileCard,
-    metaFields: props.metaFields
+  }, renderAuthor({
+    file
+  }), renderFileSize({
+    file
+  }), ReSelectButton({
+    file,
+    toggleAddFilesPanel,
+    i18n
+  })), h(MetaErrorMessage, {
+    file: file,
+    i18n: i18n,
+    toggleFileCard: toggleFileCard,
+    metaFields: metaFields
   }));
 }

lib/components/FileItem/FilePreviewAndLink/index.d.ts

@@ -1,5 +0,5 @@
-import { type ComponentChild } from 'preact';
+import { h } from 'preact';
 type $TSFixMe = any;
-export default function FilePreviewAndLink(props: $TSFixMe): ComponentChild;
+export default function FilePreviewAndLink(props: $TSFixMe): h.JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

lib/components/FileItem/FileProgress/index.d.ts

@@ -1,5 +0,20 @@
-import { type ComponentChild } from 'preact';
-type $TSFixMe = any;
-export default function FileProgress(props: $TSFixMe): ComponentChild;
+import type { State, Uppy, UppyFile } from '@uppy/core';
+import type { I18n } from '@uppy/utils/lib/Translator';
+import type { Body, Meta } from '@uppy/utils/lib/UppyFile';
+import { h } from 'preact';
+interface Props<M extends Meta, B extends Body> {
+    uppy: Uppy<M, B>;
+    file: UppyFile<M, B>;
+    isUploaded: boolean;
+    error: string | false;
+    recoveredState: State<M, B>['recoveredState'];
+    hideRetryButton: boolean;
+    hidePauseResumeButton: boolean;
+    hideCancelButton: boolean;
+    resumableUploads: boolean;
+    individualCancellation: boolean;
+    i18n: I18n;
+}
+export default function FileProgress<M extends Meta, B extends Body>(props: Props<M, B>): h.JSX.Element | null;
 export {};
 //# sourceMappingURL=index.d.ts.map

lib/components/FileItem/FileProgress/index.js

@@ -0,2 +1,4 @@
+/* eslint-disable react/no-unused-prop-types */
 /* eslint-disable react/destructuring-assignment */
+
 import { h } from 'preact';
@@ -87,2 +89,5 @@ function onPauseResumeCancelRetry(props) {
   }
+  if (props.file.progress.percentage === undefined) {
+    return null;
+  }
 
@@ -107,3 +112,3 @@ // Green checkmark when complete
   if (props.recoveredState) {
-    return undefined;
+    return null;
   }
@@ -110,0 +115,0 @@

lib/components/FileItem/index.d.ts

 import { Component, type ComponentChild } from 'preact';
-type $TSFixMe = any;
-export default class FileItem extends Component {
+import type { UppyFile, Body, Meta } from '@uppy/utils/lib/UppyFile';
+import type { I18n } from '@uppy/utils/lib/Translator';
+import type Uppy from '@uppy/core';
+import type { State } from '@uppy/core';
+import type { DashboardState } from '../../Dashboard.js';
+type Props<M extends Meta, B extends Body> = {
+    file: UppyFile<M, B>;
+    handleRequestThumbnail: (file: UppyFile<M, B>) => void;
+    handleCancelThumbnail: (file: UppyFile<M, B>) => void;
+    individualCancellation: boolean;
+    showRemoveButtonAfterComplete: boolean;
+    recoveredState: State<M, B>['recoveredState'];
+    resumableUploads: boolean;
+    i18n: I18n;
+    role: string;
+    showLinkToFileUploadResult: boolean;
+    toggleFileCard: (show: boolean, fileId: string) => void;
+    metaFields: DashboardState<M, B>['metaFields'];
+    id: string;
+    containerWidth: number;
+    containerHeight: number;
+    toggleAddFilesPanel: (show: boolean) => void;
+    isSingleFile: boolean;
+    hideRetryButton: boolean;
+    hideCancelButton: boolean;
+    hidePauseResumeButton: boolean;
+    canEditFile: (file: UppyFile<M, B>) => boolean;
+    openFileEditor: (file: UppyFile<M, B>) => void;
+    uppy: Uppy<M, B>;
+};
+export default class FileItem<M extends Meta, B extends Body> extends Component<Props<M, B>> {
     componentDidMount(): void;
-    shouldComponentUpdate(nextProps: $TSFixMe): boolean;
+    shouldComponentUpdate(nextProps: Props<M, B>): boolean;
     componentDidUpdate(): void;
@@ -7,0 +36,0 @@ componentWillUnmount(): void;

lib/components/FileItem/index.js

@@ -1,4 +0,1 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck Typing this file requires more work, skipping it to unblock the rest of the transition.
-
 /* eslint-disable react/destructuring-assignment */
@@ -48,4 +45,4 @@ import { h, Component } from 'preact';
     const isProcessing = file.progress.preprocess || file.progress.postprocess;
-    const isUploaded = file.progress.uploadComplete && !isProcessing && !file.error;
-    const uploadInProgressOrComplete = file.progress.uploadStarted || isProcessing;
+    const isUploaded = !!file.progress.uploadComplete && !isProcessing && !file.error;
+    const uploadInProgressOrComplete = !!file.progress.uploadStarted || !!isProcessing;
     const uploadInProgress = file.progress.uploadStarted && !file.progress.uploadComplete || isProcessing;
@@ -94,3 +91,2 @@ const error = file.error || false;
       recoveredState: this.props.recoveredState,
-      showRemoveButtonAfterComplete: this.props.showRemoveButtonAfterComplete,
       resumableUploads: this.props.resumableUploads,
@@ -103,4 +99,2 @@ individualCancellation: this.props.individualCancellation,
       file: file,
-      id: this.props.id,
-      acquirers: this.props.acquirers,
       containerWidth: this.props.containerWidth,
@@ -107,0 +101,0 @@ containerHeight: this.props.containerHeight,

lib/components/FileList.d.ts

 import { h } from 'preact';
-type $TSFixMe = any;
-export default function FileList({ id, error, i18n, uppy, files, acquirers, resumableUploads, hideRetryButton, hidePauseResumeButton, hideCancelButton, showLinkToFileUploadResult, showRemoveButtonAfterComplete, isWide, metaFields, isSingleFile, toggleFileCard, handleRequestThumbnail, handleCancelThumbnail, recoveredState, individualCancellation, itemsPerRow, openFileEditor, canEditFile, toggleAddFilesPanel, containerWidth, containerHeight, }: $TSFixMe): h.JSX.Element;
+import type { UppyFile, Uppy, State } from '@uppy/core';
+import type { I18n } from '@uppy/utils/lib/Translator';
+import type { Body, Meta } from '@uppy/utils/lib/UppyFile';
+import type { DashboardState } from '../Dashboard.js';
+type FileListProps<M extends Meta, B extends Body> = {
+    id: string;
+    i18n: I18n;
+    uppy: Uppy<M, B>;
+    files: State<M, B>['files'];
+    resumableUploads: boolean;
+    hideRetryButton: boolean;
+    hidePauseResumeButton: boolean;
+    hideCancelButton: boolean;
+    showLinkToFileUploadResult: boolean;
+    showRemoveButtonAfterComplete: boolean;
+    metaFields: DashboardState<M, B>['metaFields'];
+    isSingleFile: boolean;
+    toggleFileCard: (show: boolean, fileId: string) => void;
+    handleRequestThumbnail: (file: UppyFile<M, B>) => void;
+    handleCancelThumbnail: (file: UppyFile<M, B>) => void;
+    recoveredState: State<M, B>['recoveredState'];
+    individualCancellation: boolean;
+    itemsPerRow: number;
+    openFileEditor: (file: UppyFile<M, B>) => void;
+    canEditFile: (file: UppyFile<M, B>) => boolean;
+    toggleAddFilesPanel: (show: boolean) => void;
+    containerWidth: number;
+    containerHeight: number;
+};
+export default function FileList<M extends Meta, B extends Body>({ id, i18n, uppy, files, resumableUploads, hideRetryButton, hidePauseResumeButton, hideCancelButton, showLinkToFileUploadResult, showRemoveButtonAfterComplete, metaFields, isSingleFile, toggleFileCard, handleRequestThumbnail, handleCancelThumbnail, recoveredState, individualCancellation, itemsPerRow, openFileEditor, canEditFile, toggleAddFilesPanel, containerWidth, containerHeight, }: FileListProps<M, B>): h.JSX.Element;
 export {};
 //# sourceMappingURL=FileList.d.ts.map

lib/components/FileList.js

@@ -24,7 +24,5 @@ import { h } from 'preact';
     id,
-    error,
     i18n,
     uppy,
     files,
-    acquirers,
     resumableUploads,
@@ -36,3 +34,2 @@ hideRetryButton,
     showRemoveButtonAfterComplete,
-    isWide,
     metaFields,
@@ -62,3 +59,3 @@ isSingleFile,
   const rows = useMemo(() => {
-    const sortByGhostComesFirst = (file1, file2) => files[file2].isGhost - files[file1].isGhost;
+    const sortByGhostComesFirst = (file1, file2) => Number(files[file2].isGhost) - Number(files[file1].isGhost);
     const fileIds = Object.keys(files);
@@ -68,19 +65,17 @@ if (recoveredState) fileIds.sort(sortByGhostComesFirst);
   }, [files, itemsPerRow, recoveredState]);
-  const renderRow = (row // The `role="presentation` attribute ensures that the list items are properly
-  ) =>
-  // associated with the `VirtualList` element.
-  // We use the first file ID as the key—this should not change across scroll rerenders
-  h("div", {
-    class: "uppy-Dashboard-filesInner",
-    role: "presentation",
+  const renderRow = row => h("div", {
+    class: "uppy-Dashboard-filesInner"
+    // The `role="presentation` attribute ensures that the list items are properly
+    // associated with the `VirtualList` element.
+    ,
+    role: "presentation"
+    // We use the first file ID as the key — this should not change across scroll rerenders.
+    ,
     key: row[0]
   }, row.map(fileID => h(FileItem, {
-    key: fileID
-    // @ts-expect-error it's fine
-    ,
+    key: fileID,
     uppy: uppy
     // FIXME This is confusing, it's actually the Dashboard's plugin ID
     ,
-    id: id,
-    error: error
+    id: id
     // TODO move this to context
@@ -91,3 +86,2 @@ ,
     ,
-    acquirers: acquirers,
     resumableUploads: resumableUploads,
@@ -102,3 +96,2 @@ individualCancellation: individualCancellation
     showRemoveButtonAfterComplete: showRemoveButtonAfterComplete,
-    isWide: isWide,
     metaFields: metaFields,
@@ -105,0 +98,0 @@ recoveredState: recoveredState,

lib/Dashboard.d.ts

@@ -42,3 +42,3 @@ import { UIPlugin, type UIPluginOptions, type UnknownPlugin, type Uppy, type State } from '@uppy/core';
 }
-interface DashboardState<M extends Meta, B extends Body> {
+export interface DashboardState<M extends Meta, B extends Body> {
     targets: Target[];
@@ -45,0 +45,0 @@ activePickerPanel: Target | undefined;

lib/Dashboard.js

@@ -21,3 +21,3 @@ function _classPrivateFieldLooseBase(e, t) { if (!{}.hasOwnProperty.call(e, t)) throw new TypeError("attempted to use private field on non-instance"); return e; }
 const packageJson = {
-  "version": "4.0.1"
+  "version": "4.0.2"
 };
@@ -24,0 +24,0 @@ import locale from "./locale.js";

package.json

 {
   "name": "@uppy/dashboard",
   "description": "Universal UI plugin for Uppy.",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "license": "MIT",
@@ -28,5 +28,5 @@ "main": "lib/index.js",
     "@uppy/provider-views": "^4.0.0",
-    "@uppy/status-bar": "^4.0.0",
+    "@uppy/status-bar": "^4.0.1",
     "@uppy/thumbnail-generator": "^4.0.0",
-    "@uppy/utils": "^6.0.0",
+    "@uppy/utils": "^6.0.1",
     "classnames": "^2.2.6",
@@ -41,5 +41,5 @@ "lodash": "^4.17.21",
     "@uppy/google-drive": "^4.0.0",
-    "@uppy/status-bar": "^4.0.0",
+    "@uppy/status-bar": "^4.0.1",
     "@uppy/url": "^4.0.0",
-    "@uppy/webcam": "^4.0.0",
+    "@uppy/webcam": "^4.0.1",
     "resize-observer-polyfill": "^1.5.0",
@@ -49,4 +49,4 @@ "vitest": "^1.2.1"
   "peerDependencies": {
-    "@uppy/core": "^4.0.1"
+    "@uppy/core": "^4.1.0"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

772529

increased by2.29%

Lines of code

11101

increased by2.36%

Dependency changes

• Updated@uppy/status-bar@^4.0.1

• Updated@uppy/utils@^6.0.1