@chayns-components/gallery 5.0.0-beta.107 → 5.0.0-beta.108

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,9 +6,13 @@ export type GalleryProps = {
6
6
  */
7
7
  accessToken: string;
8
8
  /**
9
- * Function to be executed when files are added or removed
9
+ * Function to be executed when files are added
10
10
  */
11
- onChange: (files: UploadedFile[]) => void;
11
+ onAdd: (Files: UploadedFile[]) => void;
12
+ /**
13
+ * Function to be executed when a file is removed
14
+ */
15
+ onRemove: (file: UploadedFile) => void;
12
16
  /**
13
17
  * PersonId of the user
14
18
  */
@@ -17,7 +17,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
17
17
  const Gallery = _ref => {
18
18
  let {
19
19
  accessToken,
20
- onChange,
20
+ onAdd,
21
+ onRemove,
21
22
  personId
22
23
  } = _ref;
23
24
  const [uploadedFiles, setUploadedFiles] = (0, _react.useState)();
@@ -59,13 +60,16 @@ const Gallery = _ref => {
59
60
  }));
60
61
  newUploadedFiles = newUploadedFiles.concat(await Promise.all(imageResult));
61
62
  if (!uploadedFiles) {
63
+ onAdd(newUploadedFiles);
62
64
  setUploadedFiles(newUploadedFiles);
63
- onChange(newUploadedFiles);
64
65
  return;
65
66
  }
66
- setUploadedFiles((0, _file.filterDuplicateFiles)(uploadedFiles, newUploadedFiles));
67
- onChange((0, _file.filterDuplicateFiles)(uploadedFiles, newUploadedFiles));
68
- }, [accessToken, onChange, personId, uploadedFiles]);
67
+ const {
68
+ newUniqueFiles
69
+ } = (0, _file.filterDuplicateFiles)(uploadedFiles, newUploadedFiles);
70
+ onAdd(newUniqueFiles);
71
+ setUploadedFiles(prevState => prevState ? [...prevState, ...newUniqueFiles] : [...newUniqueFiles]);
72
+ }, [accessToken, onAdd, personId, uploadedFiles]);
69
73
 
70
74
  /**
71
75
  * This function adds new data to the existing data list
@@ -123,9 +127,18 @@ const Gallery = _ref => {
123
127
  }
124
128
  return file.key !== key;
125
129
  });
130
+ const deletedFile = uploadedFiles === null || uploadedFiles === void 0 ? void 0 : uploadedFiles.find(file => {
131
+ if ('thumbnailUrl' in file) {
132
+ return file.id === key;
133
+ }
134
+ return file.key === key;
135
+ });
126
136
  setUploadedFiles(filteredFiles !== null && filteredFiles !== void 0 ? filteredFiles : []);
127
- onChange(filteredFiles !== null && filteredFiles !== void 0 ? filteredFiles : []);
128
- }, [onChange, uploadedFiles]);
137
+ if (!deletedFile) {
138
+ return;
139
+ }
140
+ onRemove(deletedFile);
141
+ }, [onRemove, uploadedFiles]);
129
142
 
130
143
  /**
131
144
  * This function shows a selected file
@@ -153,13 +166,17 @@ const Gallery = _ref => {
153
166
  }, /*#__PURE__*/_react.default.createElement(_core.Icon, {
154
167
  size: 20,
155
168
  icons: ['ts-wrong']
156
- })), 'thumbnailUrl' in file ? /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemVideo, {
157
- onClick: () => showFile(file),
169
+ })), 'thumbnailUrl' in file ? /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemVideoWrapper, {
170
+ onClick: () => showFile(file)
171
+ }, /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemPlayIcon, null, /*#__PURE__*/_react.default.createElement(_core.Icon, {
172
+ size: 30,
173
+ icons: ['fa fa-play']
174
+ })), /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemVideo, {
158
175
  poster: file.thumbnailUrl
159
176
  }, /*#__PURE__*/_react.default.createElement("source", {
160
177
  src: file.url,
161
178
  type: "video/mp4"
162
- })) : /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemImage, {
179
+ }))) : /*#__PURE__*/_react.default.createElement(_Gallery.StyledGalleryItemImage, {
163
180
  onClick: () => showFile(file),
164
181
  draggable: false,
165
182
  src: `${file.base}/${file.key}`
@@ -1 +1 @@
1
- {"version":3,"file":"Gallery.js","names":["_react","_interopRequireWildcard","require","_post","_post2","_file","_Gallery","_core","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Gallery","_ref","accessToken","onChange","personId","uploadedFiles","setUploadedFiles","useState","uploadFiles","useCallback","filesToUpload","videos","filter","_ref2","type","includes","images","_ref3","newUploadedFiles","videoResult","map","video","postVideo","file","concat","Promise","all","flat","imageResult","image","imageUpload","filterDuplicateFiles","handleAdd","filesAdd","openSelectDialog","selectFiles","multiple","then","selectedFiles","length","fileArray","convertFileListToArray","filteredFileArray","_ref4","size","sizeInMB","handleDelete","filteredFiles","id","showFile","chayns","openVideo","url","openImage","base","galleryItems","useMemo","items","forEach","push","createElement","StyledGalleryItem","StyledGalleryItemDeleteButton","onClick","Icon","icons","StyledGalleryItemVideo","poster","thumbnailUrl","src","StyledGalleryItemImage","draggable","StyledGalleryItemAdd","StyledGallery","displayName","_default","exports"],"sources":["../../../src/components/gallery/Gallery.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useMemo, useState } from 'react';\nimport { imageUpload } from '../../api/image/post';\nimport { postVideo } from '../../api/video/post';\nimport { convertFileListToArray, filterDuplicateFiles, selectFiles } from '../../utils/file';\nimport {\n StyledGallery,\n StyledGalleryItem,\n StyledGalleryItemAdd,\n StyledGalleryItemDeleteButton,\n StyledGalleryItemImage,\n StyledGalleryItemVideo,\n} from './Gallery.styles';\n\n// Types\nimport { Icon } from '@chayns-components/core';\nimport type { Image, UploadedFile, Video } from '../../types/files';\n\nexport type GalleryProps = {\n /**\n * AccessToken of the user\n */\n accessToken: string;\n /**\n * Function to be executed when files are added or removed\n */\n onChange: (files: UploadedFile[]) => void;\n /**\n * PersonId of the user\n */\n personId: string;\n};\n\nconst Gallery: FC<GalleryProps> = ({ accessToken, onChange, personId }) => {\n const [uploadedFiles, setUploadedFiles] = useState<UploadedFile[]>();\n\n /**\n * Upload files\n */\n const uploadFiles = useCallback(\n async (filesToUpload: File[]) => {\n if (!filesToUpload) {\n return;\n }\n\n const videos = filesToUpload.filter(({ type }) => type.includes('video/'));\n const images = filesToUpload.filter(({ type }) => type.includes('image/'));\n let newUploadedFiles: UploadedFile[] = [];\n\n // Upload videos\n const videoResult: Promise<Video>[] = videos.map((video) =>\n postVideo({ accessToken, file: video })\n );\n\n newUploadedFiles = newUploadedFiles.concat(await Promise.all(videoResult));\n newUploadedFiles = newUploadedFiles.flat();\n\n // Upload images\n const imageResult: Promise<Image>[] = images.map((image) =>\n imageUpload({\n accessToken,\n file: image,\n personId,\n })\n );\n\n newUploadedFiles = newUploadedFiles.concat(await Promise.all(imageResult));\n\n if (!uploadedFiles) {\n setUploadedFiles(newUploadedFiles);\n\n onChange(newUploadedFiles);\n\n return;\n }\n\n setUploadedFiles(filterDuplicateFiles(uploadedFiles, newUploadedFiles));\n\n onChange(filterDuplicateFiles(uploadedFiles, newUploadedFiles));\n },\n [accessToken, onChange, personId, uploadedFiles]\n );\n\n /**\n * This function adds new data to the existing data list\n */\n const handleAdd = useCallback(\n (filesAdd: File[]) => {\n if (!filesAdd) {\n return;\n }\n\n void uploadFiles(filesAdd);\n },\n [uploadFiles]\n );\n\n /**\n * Open a dialog to select files\n */\n const openSelectDialog = useCallback(() => {\n void selectFiles({\n multiple: true,\n type: 'image/*, video/*',\n }).then((selectedFiles) => {\n if (selectedFiles && selectedFiles.length > 0) {\n const fileArray = convertFileListToArray(selectedFiles);\n\n // Filters files to use only under 64MB\n const filteredFileArray = fileArray.filter(({ size, type }) => {\n const sizeInMB = size / 1024 / 1024;\n\n if (type.includes('video/') && sizeInMB > 500) {\n return false;\n }\n\n return !(type.includes('image/') && sizeInMB > 64);\n });\n\n if (fileArray.length !== filteredFileArray.length) {\n // ToDo show dialog that some files are to big\n }\n\n if (filteredFileArray.length === 0) {\n // ToDo show dialog that all files are to big\n\n return;\n }\n\n handleAdd(filteredFileArray);\n }\n });\n }, [handleAdd]);\n\n /**\n * This function deletes a selected file from the data list\n */\n const handleDelete = useCallback(\n (key: number | string) => {\n const filteredFiles = uploadedFiles?.filter((file) => {\n if ('thumbnailUrl' in file) {\n return file.id !== key;\n }\n return file.key !== key;\n });\n\n setUploadedFiles(filteredFiles ?? []);\n\n onChange(filteredFiles ?? []);\n },\n [onChange, uploadedFiles]\n );\n\n /**\n * This function shows a selected file\n */\n const showFile = useCallback((file: UploadedFile) => {\n if ('thumbnailUrl' in file) {\n // @ts-expect-error: Type is correct here\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access\n void chayns.openVideo(file.url);\n\n return;\n }\n\n // @ts-expect-error: Type is correct here\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access\n void chayns.openImage([`${file.base}/${file.key}`], 0);\n }, []);\n\n const galleryItems = useMemo(() => {\n const items: ReactElement[] = [];\n\n if (uploadedFiles) {\n uploadedFiles.forEach((file) => {\n items.push(\n <StyledGalleryItem key={'thumbnailUrl' in file ? file.id : file.key}>\n <StyledGalleryItemDeleteButton\n onClick={() =>\n handleDelete('thumbnailUrl' in file ? file.id : file.key)\n }\n >\n <Icon size={20} icons={['ts-wrong']} />\n </StyledGalleryItemDeleteButton>\n {'thumbnailUrl' in file ? (\n <StyledGalleryItemVideo\n onClick={() => showFile(file)}\n poster={file.thumbnailUrl}\n >\n <source src={file.url} type=\"video/mp4\" />\n </StyledGalleryItemVideo>\n ) : (\n <StyledGalleryItemImage\n onClick={() => showFile(file)}\n draggable={false}\n src={`${file.base}/${file.key}`}\n />\n )}\n </StyledGalleryItem>\n );\n });\n }\n\n items.push(\n <StyledGalleryItem key=\"addButton\">\n <StyledGalleryItemAdd onClick={openSelectDialog}>\n <Icon size={40} icons={['fa fa-plus']} />\n </StyledGalleryItemAdd>\n </StyledGalleryItem>\n );\n\n return items;\n }, [handleDelete, openSelectDialog, showFile, uploadedFiles]);\n\n return <StyledGallery>{galleryItems}</StyledGallery>;\n};\n\nGallery.displayName = 'Gallery';\n\nexport default Gallery;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAUA,IAAAK,KAAA,GAAAL,OAAA;AAA+C,SAAAM,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAR,wBAAAY,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAD/C;;AAmBA,MAAMW,OAAyB,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,WAAW;IAAEC,QAAQ;IAAEC;EAAS,CAAC,GAAAH,IAAA;EAClE,MAAM,CAACI,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,GAAkB;;EAEpE;AACJ;AACA;EACI,MAAMC,WAAW,GAAG,IAAAC,kBAAW,EAC3B,MAAOC,aAAqB,IAAK;IAC7B,IAAI,CAACA,aAAa,EAAE;MAChB;IACJ;IAEA,MAAMC,MAAM,GAAGD,aAAa,CAACE,MAAM,CAACC,KAAA;MAAA,IAAC;QAAEC;MAAK,CAAC,GAAAD,KAAA;MAAA,OAAKC,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC;IAAA,EAAC;IAC1E,MAAMC,MAAM,GAAGN,aAAa,CAACE,MAAM,CAACK,KAAA;MAAA,IAAC;QAAEH;MAAK,CAAC,GAAAG,KAAA;MAAA,OAAKH,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC;IAAA,EAAC;IAC1E,IAAIG,gBAAgC,GAAG,EAAE;;IAEzC;IACA,MAAMC,WAA6B,GAAGR,MAAM,CAACS,GAAG,CAAEC,KAAK,IACnD,IAAAC,gBAAS,EAAC;MAAEpB,WAAW;MAAEqB,IAAI,EAAEF;IAAM,CAAC,CAAC,CAC1C;IAEDH,gBAAgB,GAAGA,gBAAgB,CAACM,MAAM,CAAC,MAAMC,OAAO,CAACC,GAAG,CAACP,WAAW,CAAC,CAAC;IAC1ED,gBAAgB,GAAGA,gBAAgB,CAACS,IAAI,EAAE;;IAE1C;IACA,MAAMC,WAA6B,GAAGZ,MAAM,CAACI,GAAG,CAAES,KAAK,IACnD,IAAAC,iBAAW,EAAC;MACR5B,WAAW;MACXqB,IAAI,EAAEM,KAAK;MACXzB;IACJ,CAAC,CAAC,CACL;IAEDc,gBAAgB,GAAGA,gBAAgB,CAACM,MAAM,CAAC,MAAMC,OAAO,CAACC,GAAG,CAACE,WAAW,CAAC,CAAC;IAE1E,IAAI,CAACvB,aAAa,EAAE;MAChBC,gBAAgB,CAACY,gBAAgB,CAAC;MAElCf,QAAQ,CAACe,gBAAgB,CAAC;MAE1B;IACJ;IAEAZ,gBAAgB,CAAC,IAAAyB,0BAAoB,EAAC1B,aAAa,EAAEa,gBAAgB,CAAC,CAAC;IAEvEf,QAAQ,CAAC,IAAA4B,0BAAoB,EAAC1B,aAAa,EAAEa,gBAAgB,CAAC,CAAC;EACnE,CAAC,EACD,CAAChB,WAAW,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,aAAa,CAAC,CACnD;;EAED;AACJ;AACA;EACI,MAAM2B,SAAS,GAAG,IAAAvB,kBAAW,EACxBwB,QAAgB,IAAK;IAClB,IAAI,CAACA,QAAQ,EAAE;MACX;IACJ;IAEA,KAAKzB,WAAW,CAACyB,QAAQ,CAAC;EAC9B,CAAC,EACD,CAACzB,WAAW,CAAC,CAChB;;EAED;AACJ;AACA;EACI,MAAM0B,gBAAgB,GAAG,IAAAzB,kBAAW,EAAC,MAAM;IACvC,KAAK,IAAA0B,iBAAW,EAAC;MACbC,QAAQ,EAAE,IAAI;MACdtB,IAAI,EAAE;IACV,CAAC,CAAC,CAACuB,IAAI,CAAEC,aAAa,IAAK;MACvB,IAAIA,aAAa,IAAIA,aAAa,CAACC,MAAM,GAAG,CAAC,EAAE;QAC3C,MAAMC,SAAS,GAAG,IAAAC,4BAAsB,EAACH,aAAa,CAAC;;QAEvD;QACA,MAAMI,iBAAiB,GAAGF,SAAS,CAAC5B,MAAM,CAAC+B,KAAA,IAAoB;UAAA,IAAnB;YAAEC,IAAI;YAAE9B;UAAK,CAAC,GAAA6B,KAAA;UACtD,MAAME,QAAQ,GAAGD,IAAI,GAAG,IAAI,GAAG,IAAI;UAEnC,IAAI9B,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,IAAI8B,QAAQ,GAAG,GAAG,EAAE;YAC3C,OAAO,KAAK;UAChB;UAEA,OAAO,EAAE/B,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,IAAI8B,QAAQ,GAAG,EAAE,CAAC;QACtD,CAAC,CAAC;QAEF,IAAIL,SAAS,CAACD,MAAM,KAAKG,iBAAiB,CAACH,MAAM,EAAE;UAC/C;QAAA;QAGJ,IAAIG,iBAAiB,CAACH,MAAM,KAAK,CAAC,EAAE;UAChC;;UAEA;QACJ;QAEAP,SAAS,CAACU,iBAAiB,CAAC;MAChC;IACJ,CAAC,CAAC;EACN,CAAC,EAAE,CAACV,SAAS,CAAC,CAAC;;EAEf;AACJ;AACA;EACI,MAAMc,YAAY,GAAG,IAAArC,kBAAW,EAC3Bf,GAAoB,IAAK;IACtB,MAAMqD,aAAa,GAAG1C,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEO,MAAM,CAAEW,IAAI,IAAK;MAClD,IAAI,cAAc,IAAIA,IAAI,EAAE;QACxB,OAAOA,IAAI,CAACyB,EAAE,KAAKtD,GAAG;MAC1B;MACA,OAAO6B,IAAI,CAAC7B,GAAG,KAAKA,GAAG;IAC3B,CAAC,CAAC;IAEFY,gBAAgB,CAACyC,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAI,EAAE,CAAC;IAErC5C,QAAQ,CAAC4C,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAI,EAAE,CAAC;EACjC,CAAC,EACD,CAAC5C,QAAQ,EAAEE,aAAa,CAAC,CAC5B;;EAED;AACJ;AACA;EACI,MAAM4C,QAAQ,GAAG,IAAAxC,kBAAW,EAAEc,IAAkB,IAAK;IACjD,IAAI,cAAc,IAAIA,IAAI,EAAE;MACxB;MACA;MACA,KAAK2B,MAAM,CAACC,SAAS,CAAC5B,IAAI,CAAC6B,GAAG,CAAC;MAE/B;IACJ;;IAEA;IACA;IACA,KAAKF,MAAM,CAACG,SAAS,CAAC,CAAE,GAAE9B,IAAI,CAAC+B,IAAK,IAAG/B,IAAI,CAAC7B,GAAI,EAAC,CAAC,EAAE,CAAC,CAAC;EAC1D,CAAC,EAAE,EAAE,CAAC;EAEN,MAAM6D,YAAY,GAAG,IAAAC,cAAO,EAAC,MAAM;IAC/B,MAAMC,KAAqB,GAAG,EAAE;IAEhC,IAAIpD,aAAa,EAAE;MACfA,aAAa,CAACqD,OAAO,CAAEnC,IAAI,IAAK;QAC5BkC,KAAK,CAACE,IAAI,eACNzF,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAAqF,iBAAiB;UAACnE,GAAG,EAAE,cAAc,IAAI6B,IAAI,GAAGA,IAAI,CAACyB,EAAE,GAAGzB,IAAI,CAAC7B;QAAI,gBAChExB,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAAsF,6BAA6B;UAC1BC,OAAO,EAAEA,CAAA,KACLjB,YAAY,CAAC,cAAc,IAAIvB,IAAI,GAAGA,IAAI,CAACyB,EAAE,GAAGzB,IAAI,CAAC7B,GAAG;QAC3D,gBAEDxB,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACnF,KAAA,CAAAuF,IAAI;UAACpB,IAAI,EAAE,EAAG;UAACqB,KAAK,EAAE,CAAC,UAAU;QAAE,EAAG,CACX,EAC/B,cAAc,IAAI1C,IAAI,gBACnBrD,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAA0F,sBAAsB;UACnBH,OAAO,EAAEA,CAAA,KAAMd,QAAQ,CAAC1B,IAAI,CAAE;UAC9B4C,MAAM,EAAE5C,IAAI,CAAC6C;QAAa,gBAE1BlG,MAAA,CAAAe,OAAA,CAAA2E,aAAA;UAAQS,GAAG,EAAE9C,IAAI,CAAC6B,GAAI;UAACtC,IAAI,EAAC;QAAW,EAAG,CACrB,gBAEzB5C,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAA8F,sBAAsB;UACnBP,OAAO,EAAEA,CAAA,KAAMd,QAAQ,CAAC1B,IAAI,CAAE;UAC9BgD,SAAS,EAAE,KAAM;UACjBF,GAAG,EAAG,GAAE9C,IAAI,CAAC+B,IAAK,IAAG/B,IAAI,CAAC7B,GAAI;QAAE,EAEvC,CACe,CACvB;MACL,CAAC,CAAC;IACN;IAEA+D,KAAK,CAACE,IAAI,eACNzF,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAAqF,iBAAiB;MAACnE,GAAG,EAAC;IAAW,gBAC9BxB,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAAgG,oBAAoB;MAACT,OAAO,EAAE7B;IAAiB,gBAC5ChE,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACnF,KAAA,CAAAuF,IAAI;MAACpB,IAAI,EAAE,EAAG;MAACqB,KAAK,EAAE,CAAC,YAAY;IAAE,EAAG,CACtB,CACP,CACvB;IAED,OAAOR,KAAK;EAChB,CAAC,EAAE,CAACX,YAAY,EAAEZ,gBAAgB,EAAEe,QAAQ,EAAE5C,aAAa,CAAC,CAAC;EAE7D,oBAAOnC,MAAA,CAAAe,OAAA,CAAA2E,aAAA,CAACpF,QAAA,CAAAiG,aAAa,QAAElB,YAAY,CAAiB;AACxD,CAAC;AAEDvD,OAAO,CAAC0E,WAAW,GAAG,SAAS;AAAC,IAAAC,QAAA,GAEjB3E,OAAO;AAAA4E,OAAA,CAAA3F,OAAA,GAAA0F,QAAA"}
1
+ {"version":3,"file":"Gallery.js","names":["_react","_interopRequireWildcard","require","_post","_post2","_file","_Gallery","_core","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Gallery","_ref","accessToken","onAdd","onRemove","personId","uploadedFiles","setUploadedFiles","useState","uploadFiles","useCallback","filesToUpload","videos","filter","_ref2","type","includes","images","_ref3","newUploadedFiles","videoResult","map","video","postVideo","file","concat","Promise","all","flat","imageResult","image","imageUpload","newUniqueFiles","filterDuplicateFiles","prevState","handleAdd","filesAdd","openSelectDialog","selectFiles","multiple","then","selectedFiles","length","fileArray","convertFileListToArray","filteredFileArray","_ref4","size","sizeInMB","handleDelete","filteredFiles","id","deletedFile","find","showFile","chayns","openVideo","url","openImage","base","galleryItems","useMemo","items","forEach","push","createElement","StyledGalleryItem","StyledGalleryItemDeleteButton","onClick","Icon","icons","StyledGalleryItemVideoWrapper","StyledGalleryItemPlayIcon","StyledGalleryItemVideo","poster","thumbnailUrl","src","StyledGalleryItemImage","draggable","StyledGalleryItemAdd","StyledGallery","displayName","_default","exports"],"sources":["../../../src/components/gallery/Gallery.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useMemo, useState } from 'react';\nimport { imageUpload } from '../../api/image/post';\nimport { postVideo } from '../../api/video/post';\nimport { convertFileListToArray, filterDuplicateFiles, selectFiles } from '../../utils/file';\nimport {\n StyledGallery,\n StyledGalleryItem,\n StyledGalleryItemAdd,\n StyledGalleryItemDeleteButton,\n StyledGalleryItemImage,\n StyledGalleryItemPlayIcon,\n StyledGalleryItemVideo,\n StyledGalleryItemVideoWrapper,\n} from './Gallery.styles';\n\n// Types\nimport { Icon } from '@chayns-components/core';\nimport type { Image, UploadedFile, Video } from '../../types/files';\n\nexport type GalleryProps = {\n /**\n * AccessToken of the user\n */\n accessToken: string;\n /**\n * Function to be executed when files are added\n */\n onAdd: (Files: UploadedFile[]) => void;\n /**\n * Function to be executed when a file is removed\n */\n onRemove: (file: UploadedFile) => void;\n /**\n * PersonId of the user\n */\n personId: string;\n};\n\nconst Gallery: FC<GalleryProps> = ({ accessToken, onAdd, onRemove, personId }) => {\n const [uploadedFiles, setUploadedFiles] = useState<UploadedFile[]>();\n\n /**\n * Upload files\n */\n const uploadFiles = useCallback(\n async (filesToUpload: File[]) => {\n if (!filesToUpload) {\n return;\n }\n\n const videos = filesToUpload.filter(({ type }) => type.includes('video/'));\n const images = filesToUpload.filter(({ type }) => type.includes('image/'));\n let newUploadedFiles: UploadedFile[] = [];\n\n // Upload videos\n const videoResult: Promise<Video>[] = videos.map((video) =>\n postVideo({ accessToken, file: video })\n );\n\n newUploadedFiles = newUploadedFiles.concat(await Promise.all(videoResult));\n newUploadedFiles = newUploadedFiles.flat();\n\n // Upload images\n const imageResult: Promise<Image>[] = images.map((image) =>\n imageUpload({\n accessToken,\n file: image,\n personId,\n })\n );\n\n newUploadedFiles = newUploadedFiles.concat(await Promise.all(imageResult));\n\n if (!uploadedFiles) {\n onAdd(newUploadedFiles);\n\n setUploadedFiles(newUploadedFiles);\n\n return;\n }\n\n const { newUniqueFiles } = filterDuplicateFiles(uploadedFiles, newUploadedFiles);\n\n onAdd(newUniqueFiles);\n\n setUploadedFiles((prevState) =>\n prevState ? [...prevState, ...newUniqueFiles] : [...newUniqueFiles]\n );\n },\n [accessToken, onAdd, personId, uploadedFiles]\n );\n\n /**\n * This function adds new data to the existing data list\n */\n const handleAdd = useCallback(\n (filesAdd: File[]) => {\n if (!filesAdd) {\n return;\n }\n\n void uploadFiles(filesAdd);\n },\n [uploadFiles]\n );\n\n /**\n * Open a dialog to select files\n */\n const openSelectDialog = useCallback(() => {\n void selectFiles({\n multiple: true,\n type: 'image/*, video/*',\n }).then((selectedFiles) => {\n if (selectedFiles && selectedFiles.length > 0) {\n const fileArray = convertFileListToArray(selectedFiles);\n\n // Filters files to use only under 64MB\n const filteredFileArray = fileArray.filter(({ size, type }) => {\n const sizeInMB = size / 1024 / 1024;\n\n if (type.includes('video/') && sizeInMB > 500) {\n return false;\n }\n\n return !(type.includes('image/') && sizeInMB > 64);\n });\n\n if (fileArray.length !== filteredFileArray.length) {\n // ToDo show dialog that some files are to big\n }\n\n if (filteredFileArray.length === 0) {\n // ToDo show dialog that all files are to big\n\n return;\n }\n\n handleAdd(filteredFileArray);\n }\n });\n }, [handleAdd]);\n\n /**\n * This function deletes a selected file from the data list\n */\n const handleDelete = useCallback(\n (key: number | string) => {\n const filteredFiles = uploadedFiles?.filter((file) => {\n if ('thumbnailUrl' in file) {\n return file.id !== key;\n }\n return file.key !== key;\n });\n\n const deletedFile = uploadedFiles?.find((file) => {\n if ('thumbnailUrl' in file) {\n return file.id === key;\n }\n return file.key === key;\n });\n\n setUploadedFiles(filteredFiles ?? []);\n\n if (!deletedFile) {\n return;\n }\n\n onRemove(deletedFile);\n },\n [onRemove, uploadedFiles]\n );\n\n /**\n * This function shows a selected file\n */\n const showFile = useCallback((file: UploadedFile) => {\n if ('thumbnailUrl' in file) {\n // @ts-expect-error: Type is correct here\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access\n void chayns.openVideo(file.url);\n\n return;\n }\n\n // @ts-expect-error: Type is correct here\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access\n void chayns.openImage([`${file.base}/${file.key}`], 0);\n }, []);\n\n const galleryItems = useMemo(() => {\n const items: ReactElement[] = [];\n\n if (uploadedFiles) {\n uploadedFiles.forEach((file) => {\n items.push(\n <StyledGalleryItem key={'thumbnailUrl' in file ? file.id : file.key}>\n <StyledGalleryItemDeleteButton\n onClick={() =>\n handleDelete('thumbnailUrl' in file ? file.id : file.key)\n }\n >\n <Icon size={20} icons={['ts-wrong']} />\n </StyledGalleryItemDeleteButton>\n {'thumbnailUrl' in file ? (\n <StyledGalleryItemVideoWrapper onClick={() => showFile(file)}>\n <StyledGalleryItemPlayIcon>\n <Icon size={30} icons={['fa fa-play']} />\n </StyledGalleryItemPlayIcon>\n <StyledGalleryItemVideo poster={file.thumbnailUrl}>\n <source src={file.url} type=\"video/mp4\" />\n </StyledGalleryItemVideo>\n </StyledGalleryItemVideoWrapper>\n ) : (\n <StyledGalleryItemImage\n onClick={() => showFile(file)}\n draggable={false}\n src={`${file.base}/${file.key}`}\n />\n )}\n </StyledGalleryItem>\n );\n });\n }\n\n items.push(\n <StyledGalleryItem key=\"addButton\">\n <StyledGalleryItemAdd onClick={openSelectDialog}>\n <Icon size={40} icons={['fa fa-plus']} />\n </StyledGalleryItemAdd>\n </StyledGalleryItem>\n );\n\n return items;\n }, [handleDelete, openSelectDialog, showFile, uploadedFiles]);\n\n return <StyledGallery>{galleryItems}</StyledGallery>;\n};\n\nGallery.displayName = 'Gallery';\n\nexport default Gallery;\n"],"mappings":"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"}
@@ -1,5 +1,6 @@
1
1
  export declare const StyledGallery: import("styled-components").StyledComponent<"div", any, {}, never>;
2
2
  export declare const StyledGalleryItem: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const StyledGalleryItemPlayIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
3
4
  export declare const StyledGalleryItemDeleteButton: import("styled-components").StyledComponent<"button", any, {
4
5
  theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
5
6
  }, never>;
@@ -12,3 +13,4 @@ export declare const StyledGalleryItemImage: import("styled-components").StyledC
12
13
  export declare const StyledGalleryItemVideo: import("styled-components").StyledComponent<"video", any, {
13
14
  theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
14
15
  }, never>;
16
+ export declare const StyledGalleryItemVideoWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.StyledGalleryItemVideo = exports.StyledGalleryItemImage = exports.StyledGalleryItemDeleteButton = exports.StyledGalleryItemAdd = exports.StyledGalleryItem = exports.StyledGallery = void 0;
6
+ exports.StyledGalleryItemVideoWrapper = exports.StyledGalleryItemVideo = exports.StyledGalleryItemPlayIcon = exports.StyledGalleryItemImage = exports.StyledGalleryItemDeleteButton = exports.StyledGalleryItemAdd = exports.StyledGalleryItem = exports.StyledGallery = void 0;
7
7
  var _styledComponents = _interopRequireDefault(require("styled-components"));
8
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
9
  const StyledGallery = _styledComponents.default.div`
@@ -22,6 +22,14 @@ const StyledGalleryItem = _styledComponents.default.div`
22
22
  position: relative;
23
23
  `;
24
24
  exports.StyledGalleryItem = StyledGalleryItem;
25
+ const StyledGalleryItemPlayIcon = _styledComponents.default.div`
26
+ position: absolute;
27
+ z-index: 2;
28
+ top: 50%;
29
+ left: 50%;
30
+ transform: translate(-50%, -50%);
31
+ `;
32
+ exports.StyledGalleryItemPlayIcon = StyledGalleryItemPlayIcon;
25
33
  const StyledGalleryItemDeleteButton = _styledComponents.default.button`
26
34
  background-color: rgba(
27
35
  ${_ref => {
@@ -104,4 +112,6 @@ const StyledGalleryItemVideo = _styledComponents.default.video`
104
112
  object-fit: cover;
105
113
  `;
106
114
  exports.StyledGalleryItemVideo = StyledGalleryItemVideo;
115
+ const StyledGalleryItemVideoWrapper = _styledComponents.default.div``;
116
+ exports.StyledGalleryItemVideoWrapper = StyledGalleryItemVideoWrapper;
107
117
  //# sourceMappingURL=Gallery.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Gallery.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledGallery","styled","div","exports","StyledGalleryItem","StyledGalleryItemDeleteButton","button","_ref","theme","_ref2","StyledGalleryItemAdd","_ref3","_ref4","StyledGalleryItemImage","img","_ref5","_ref6","StyledGalleryItemVideo","video","_ref7","_ref8"],"sources":["../../../src/components/gallery/Gallery.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled from 'styled-components';\n\nexport const StyledGallery = styled.div`\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding: 15px;\n\n & > * {\n flex-basis: calc(25% - 7.5px); /* 25% Breite, abzüglich des Lückenabstands */\n }\n`;\n\nexport const StyledGalleryItem = styled.div`\n position: relative;\n`;\n\ntype StyledGalleryItemDeleteButtonProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemDeleteButton = styled.button<StyledGalleryItemDeleteButtonProps>`\n background-color: rgba(\n ${({ theme }: StyledGalleryItemDeleteButtonProps) => theme['000-rgb']},\n 0.75\n );\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 2;\n height: 30px;\n width: 30px;\n`;\n\ntype StyledGalleryItemAddProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemAdd = styled.button<StyledGalleryItemAddProps>`\n background-color: ${({ theme }: StyledGalleryItemAddProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n width: 100%;\n aspect-ratio: 1 / 1;\n`;\n\ntype StyledGalleryItemImageProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemImage = styled.img<StyledGalleryItemImageProps>`\n background-color: ${({ theme }: StyledGalleryItemImageProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n z-index: 1;\n width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n`;\n\ntype StyledGalleryItemVideoProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemVideo = styled.video<StyledGalleryItemVideoProps>`\n background-color: ${({ theme }: StyledGalleryItemVideoProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEhC,MAAMG,aAAa,GAAGC,yBAAM,CAACC,GAAI;AACxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAH,aAAA,GAAAA,aAAA;AAEK,MAAMI,iBAAiB,GAAGH,yBAAM,CAACC,GAAI;AAC5C;AACA,CAAC;AAACC,OAAA,CAAAC,iBAAA,GAAAA,iBAAA;AAIK,MAAMC,6BAA6B,GAAGJ,yBAAM,CAACK,MAA2C;AAC/F;AACA,UAAUC,IAAA;EAAA,IAAC;IAAEC;EAA0C,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC9E;AACA;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAmC,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACL,OAAA,CAAAE,6BAAA,GAAAA,6BAAA;AAIK,MAAMK,oBAAoB,GAAGT,yBAAM,CAACK,MAAkC;AAC7E,wBAAwBK,KAAA;EAAA,IAAC;IAAEH;EAAiC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AAC/E;AACA,eAAeI,KAAA;EAAA,IAAC;IAAEJ;EAAmC,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA,CAAC;AAACL,OAAA,CAAAO,oBAAA,GAAAA,oBAAA;AAIK,MAAMG,sBAAsB,GAAGZ,yBAAM,CAACa,GAAiC;AAC9E,wBAAwBC,KAAA;EAAA,IAAC;IAAEP;EAAmC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACjF;AACA,eAAeQ,KAAA;EAAA,IAAC;IAAER;EAAmC,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA;AACA,CAAC;AAACL,OAAA,CAAAU,sBAAA,GAAAA,sBAAA;AAIK,MAAMI,sBAAsB,GAAGhB,yBAAM,CAACiB,KAAmC;AAChF,wBAAwBC,KAAA;EAAA,IAAC;IAAEX;EAAmC,CAAC,GAAAW,KAAA;EAAA,OAAKX,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACjF;AACA,eAAeY,KAAA;EAAA,IAAC;IAAEZ;EAAmC,CAAC,GAAAY,KAAA;EAAA,OAAKZ,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA,CAAC;AAACL,OAAA,CAAAc,sBAAA,GAAAA,sBAAA"}
1
+ {"version":3,"file":"Gallery.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledGallery","styled","div","exports","StyledGalleryItem","StyledGalleryItemPlayIcon","StyledGalleryItemDeleteButton","button","_ref","theme","_ref2","StyledGalleryItemAdd","_ref3","_ref4","StyledGalleryItemImage","img","_ref5","_ref6","StyledGalleryItemVideo","video","_ref7","_ref8","StyledGalleryItemVideoWrapper"],"sources":["../../../src/components/gallery/Gallery.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled from 'styled-components';\n\nexport const StyledGallery = styled.div`\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding: 15px;\n\n & > * {\n flex-basis: calc(25% - 7.5px); /* 25% Breite, abzüglich des Lückenabstands */\n }\n`;\n\nexport const StyledGalleryItem = styled.div`\n position: relative;\n`;\n\nexport const StyledGalleryItemPlayIcon = styled.div`\n position: absolute;\n z-index: 2;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n\ntype StyledGalleryItemDeleteButtonProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemDeleteButton = styled.button<StyledGalleryItemDeleteButtonProps>`\n background-color: rgba(\n ${({ theme }: StyledGalleryItemDeleteButtonProps) => theme['000-rgb']},\n 0.75\n );\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 2;\n height: 30px;\n width: 30px;\n`;\n\ntype StyledGalleryItemAddProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemAdd = styled.button<StyledGalleryItemAddProps>`\n background-color: ${({ theme }: StyledGalleryItemAddProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n width: 100%;\n aspect-ratio: 1 / 1;\n`;\n\ntype StyledGalleryItemImageProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemImage = styled.img<StyledGalleryItemImageProps>`\n background-color: ${({ theme }: StyledGalleryItemImageProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n z-index: 1;\n width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n`;\n\ntype StyledGalleryItemVideoProps = WithTheme<unknown>;\n\nexport const StyledGalleryItemVideo = styled.video<StyledGalleryItemVideoProps>`\n background-color: ${({ theme }: StyledGalleryItemVideoProps) => theme['101']};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledGalleryItemImageProps) => theme['009-rgb']}, 0.08) inset;\n width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n`;\n\nexport const StyledGalleryItemVideoWrapper = styled.div``;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEhC,MAAMG,aAAa,GAAGC,yBAAM,CAACC,GAAI;AACxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAH,aAAA,GAAAA,aAAA;AAEK,MAAMI,iBAAiB,GAAGH,yBAAM,CAACC,GAAI;AAC5C;AACA,CAAC;AAACC,OAAA,CAAAC,iBAAA,GAAAA,iBAAA;AAEK,MAAMC,yBAAyB,GAAGJ,yBAAM,CAACC,GAAI;AACpD;AACA;AACA;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAE,yBAAA,GAAAA,yBAAA;AAIK,MAAMC,6BAA6B,GAAGL,yBAAM,CAACM,MAA2C;AAC/F;AACA,UAAUC,IAAA;EAAA,IAAC;IAAEC;EAA0C,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC9E;AACA;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAmC,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACN,OAAA,CAAAG,6BAAA,GAAAA,6BAAA;AAIK,MAAMK,oBAAoB,GAAGV,yBAAM,CAACM,MAAkC;AAC7E,wBAAwBK,KAAA;EAAA,IAAC;IAAEH;EAAiC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AAC/E;AACA,eAAeI,KAAA;EAAA,IAAC;IAAEJ;EAAmC,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA,CAAC;AAACN,OAAA,CAAAQ,oBAAA,GAAAA,oBAAA;AAIK,MAAMG,sBAAsB,GAAGb,yBAAM,CAACc,GAAiC;AAC9E,wBAAwBC,KAAA;EAAA,IAAC;IAAEP;EAAmC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACjF;AACA,eAAeQ,KAAA;EAAA,IAAC;IAAER;EAAmC,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA;AACA,CAAC;AAACN,OAAA,CAAAW,sBAAA,GAAAA,sBAAA;AAIK,MAAMI,sBAAsB,GAAGjB,yBAAM,CAACkB,KAAmC;AAChF,wBAAwBC,KAAA;EAAA,IAAC;IAAEX;EAAmC,CAAC,GAAAW,KAAA;EAAA,OAAKX,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACjF;AACA,eAAeY,KAAA;EAAA,IAAC;IAAEZ;EAAmC,CAAC,GAAAY,KAAA;EAAA,OAAKZ,KAAK,CAAC,SAAS,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA,CAAC;AAACN,OAAA,CAAAe,sBAAA,GAAAA,sBAAA;AAEK,MAAMI,6BAA6B,GAAGrB,yBAAM,CAACC,GAAI,EAAC;AAACC,OAAA,CAAAmB,6BAAA,GAAAA,6BAAA"}
@@ -5,5 +5,8 @@ interface SelectFilesOptions {
5
5
  }
6
6
  export declare const selectFiles: ({ type, multiple }: SelectFilesOptions) => Promise<null | FileList>;
7
7
  export declare const convertFileListToArray: (fileList: FileList) => File[];
8
- export declare const filterDuplicateFiles: (oldFiles: UploadedFile[], newFiles: UploadedFile[]) => UploadedFile[];
8
+ export declare const filterDuplicateFiles: (oldFiles: UploadedFile[], newFiles: UploadedFile[]) => {
9
+ filteredFiles: UploadedFile[];
10
+ newUniqueFiles: UploadedFile[];
11
+ };
9
12
  export {};
package/lib/utils/file.js CHANGED
@@ -59,6 +59,7 @@ const filterDuplicateFiles = (oldFiles, newFiles) => {
59
59
  seenKeys.add(key);
60
60
  filteredFiles.push(file);
61
61
  });
62
+ const newUniqueFiles = [];
62
63
  newFiles.forEach(file => {
63
64
  let key;
64
65
  if ('id' in file) {
@@ -66,12 +67,33 @@ const filterDuplicateFiles = (oldFiles, newFiles) => {
66
67
  } else {
67
68
  key = file.key;
68
69
  }
69
- if (!seenKeys.has(key)) {
70
+ const oldFile = oldFiles.find(f => {
71
+ if ('id' in f && 'id' in file) {
72
+ return f.id === file.id;
73
+ }
74
+ if ('key' in f && 'key' in file) {
75
+ return f.key === file.key;
76
+ }
77
+ return null;
78
+ });
79
+ const alreadyAdded = newUniqueFiles.find(f => {
80
+ if ('id' in f && 'id' in file) {
81
+ return f.id === file.id;
82
+ }
83
+ if ('key' in f && 'key' in file) {
84
+ return f.key === file.key;
85
+ }
86
+ return null;
87
+ });
88
+ if (!oldFile && !alreadyAdded) {
70
89
  seenKeys.add(key);
71
- filteredFiles.push(file);
90
+ newUniqueFiles.push(file);
72
91
  }
73
92
  });
74
- return filteredFiles;
93
+ return {
94
+ filteredFiles,
95
+ newUniqueFiles
96
+ };
75
97
  };
76
98
  exports.filterDuplicateFiles = filterDuplicateFiles;
77
99
  //# sourceMappingURL=file.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"file.js","names":["selectFiles","_ref","type","multiple","Promise","resolve","input","document","createElement","accept","style","visibility","width","height","display","body","appendChild","addEventListener","event","removeChild","target","files","click","exports","convertFileListToArray","fileList","filesArray","i","length","file","item","push","filterDuplicateFiles","oldFiles","newFiles","seenKeys","Set","filteredFiles","forEach","key","id","toString","add","has"],"sources":["../../src/utils/file.ts"],"sourcesContent":["import type { UploadedFile } from '../types/files';\n\ninterface SelectFilesOptions {\n type: string;\n multiple: boolean;\n}\n\nexport const selectFiles = ({ type, multiple }: SelectFilesOptions): Promise<null | FileList> =>\n new Promise((resolve) => {\n const input = document.createElement('input');\n input.type = 'file';\n\n if (type !== '*/*' && type) {\n input.accept = type;\n }\n\n if (multiple) {\n input.multiple = true;\n }\n\n input.style.visibility = 'none';\n input.style.width = '0';\n input.style.height = '0';\n input.style.display = 'none';\n\n document.body.appendChild(input);\n\n input.addEventListener('change', (event) => {\n document.body.removeChild(input);\n\n const target = event.target as HTMLInputElement;\n const { files } = target;\n\n resolve(files);\n });\n\n input.click();\n });\n\nexport const convertFileListToArray = (fileList: FileList): File[] => {\n const filesArray = [];\n for (let i = 0; i < fileList.length; i++) {\n const file = fileList.item(i);\n\n if (file) {\n filesArray.push(file);\n }\n }\n\n return filesArray;\n};\n\nexport const filterDuplicateFiles = (\n oldFiles: UploadedFile[],\n newFiles: UploadedFile[]\n): UploadedFile[] => {\n const seenKeys = new Set<string>();\n const filteredFiles: UploadedFile[] = [];\n\n oldFiles.forEach((file) => {\n let key: string;\n if ('id' in file) {\n key = file.id.toString();\n } else {\n key = file.key;\n }\n\n seenKeys.add(key);\n filteredFiles.push(file);\n });\n\n newFiles.forEach((file) => {\n let key: string;\n if ('id' in file) {\n key = file.id.toString();\n } else {\n key = file.key;\n }\n\n if (!seenKeys.has(key)) {\n seenKeys.add(key);\n filteredFiles.push(file);\n }\n });\n\n return filteredFiles;\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"file.js","names":["selectFiles","_ref","type","multiple","Promise","resolve","input","document","createElement","accept","style","visibility","width","height","display","body","appendChild","addEventListener","event","removeChild","target","files","click","exports","convertFileListToArray","fileList","filesArray","i","length","file","item","push","filterDuplicateFiles","oldFiles","newFiles","seenKeys","Set","filteredFiles","forEach","key","id","toString","add","newUniqueFiles","oldFile","find","f","alreadyAdded"],"sources":["../../src/utils/file.ts"],"sourcesContent":["import type { UploadedFile } from '../types/files';\n\ninterface SelectFilesOptions {\n type: string;\n multiple: boolean;\n}\n\nexport const selectFiles = ({ type, multiple }: SelectFilesOptions): Promise<null | FileList> =>\n new Promise((resolve) => {\n const input = document.createElement('input');\n input.type = 'file';\n\n if (type !== '*/*' && type) {\n input.accept = type;\n }\n\n if (multiple) {\n input.multiple = true;\n }\n\n input.style.visibility = 'none';\n input.style.width = '0';\n input.style.height = '0';\n input.style.display = 'none';\n\n document.body.appendChild(input);\n\n input.addEventListener('change', (event) => {\n document.body.removeChild(input);\n\n const target = event.target as HTMLInputElement;\n const { files } = target;\n\n resolve(files);\n });\n\n input.click();\n });\n\nexport const convertFileListToArray = (fileList: FileList): File[] => {\n const filesArray = [];\n for (let i = 0; i < fileList.length; i++) {\n const file = fileList.item(i);\n\n if (file) {\n filesArray.push(file);\n }\n }\n\n return filesArray;\n};\n\nexport const filterDuplicateFiles = (oldFiles: UploadedFile[], newFiles: UploadedFile[]) => {\n const seenKeys = new Set<string>();\n const filteredFiles: UploadedFile[] = [];\n\n oldFiles.forEach((file) => {\n let key: string;\n if ('id' in file) {\n key = file.id.toString();\n } else {\n key = file.key;\n }\n\n seenKeys.add(key);\n filteredFiles.push(file);\n });\n\n const newUniqueFiles: UploadedFile[] = [];\n\n newFiles.forEach((file) => {\n let key: string;\n if ('id' in file) {\n key = file.id.toString();\n } else {\n key = file.key;\n }\n\n const oldFile = oldFiles.find((f) => {\n if ('id' in f && 'id' in file) {\n return f.id === file.id;\n }\n\n if ('key' in f && 'key' in file) {\n return f.key === file.key;\n }\n\n return null;\n });\n\n const alreadyAdded = newUniqueFiles.find((f) => {\n if ('id' in f && 'id' in file) {\n return f.id === file.id;\n }\n\n if ('key' in f && 'key' in file) {\n return f.key === file.key;\n }\n\n return null;\n });\n\n if (!oldFile && !alreadyAdded) {\n seenKeys.add(key);\n newUniqueFiles.push(file);\n }\n });\n\n return { filteredFiles, newUniqueFiles };\n};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/gallery",
3
- "version": "5.0.0-beta.107",
3
+ "version": "5.0.0-beta.108",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "keywords": [
6
6
  "chayns",
@@ -63,5 +63,5 @@
63
63
  "publishConfig": {
64
64
  "access": "public"
65
65
  },
66
- "gitHead": "7198903cf93e5e131f71f6d8cfe0f77ab133e504"
66
+ "gitHead": "1c3cf10e21146c54fcf4f216703961ed3c315472"
67
67
  }