@stoker-platform/web-app 0.5.139 → 0.5.141
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.
- package/CHANGELOG.md +12 -0
- package/package.json +1 -1
- package/src/Collection.tsx +35 -15
- package/src/Files.tsx +36 -13
- package/src/utils/prepareFile.ts +2 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @stoker-platform/web-app
|
|
2
2
|
|
|
3
|
+
## 0.5.141
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- fix: apply maxImageWidth processing to image file rename operation
|
|
8
|
+
|
|
9
|
+
## 0.5.140
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- feat: improve collection page transition
|
|
14
|
+
|
|
3
15
|
## 0.5.139
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/package.json
CHANGED
package/src/Collection.tsx
CHANGED
|
@@ -1722,11 +1722,11 @@ function Collection({
|
|
|
1722
1722
|
{icon ? createElement(icon) : null}
|
|
1723
1723
|
<h1>{collectionTitle}</h1>
|
|
1724
1724
|
</Card>
|
|
1725
|
-
{(connectionStatus === "online" || isPreloadCacheEnabled) && (
|
|
1725
|
+
{isInitialized && (connectionStatus === "online" || isPreloadCacheEnabled) && (
|
|
1726
1726
|
<>
|
|
1727
1727
|
{tab !== "calendar" &&
|
|
1728
1728
|
!relationList?.loadAll &&
|
|
1729
|
-
(hasRangeFilter || currentField) && (
|
|
1729
|
+
(hasRangeFilter || currentField || willHaveRangeRow) && (
|
|
1730
1730
|
<div
|
|
1731
1731
|
className={cn(
|
|
1732
1732
|
"hidden",
|
|
@@ -1736,12 +1736,22 @@ function Collection({
|
|
|
1736
1736
|
"transform -translate-x-1/2",
|
|
1737
1737
|
)}
|
|
1738
1738
|
>
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1739
|
+
{hasRangeFilter || currentField ? (
|
|
1740
|
+
<DateRangeSelector
|
|
1741
|
+
collection={collection}
|
|
1742
|
+
rangeSelector={rangeSelector}
|
|
1743
|
+
setRangeSelector={setRangeSelector}
|
|
1744
|
+
relationList={!!relationList}
|
|
1745
|
+
/>
|
|
1746
|
+
) : (
|
|
1747
|
+
<div
|
|
1748
|
+
className={cn(
|
|
1749
|
+
"h-9 rounded-md border border-input bg-background shadow-sm",
|
|
1750
|
+
relationList ? "w-[220px]" : "w-[300px]",
|
|
1751
|
+
)}
|
|
1752
|
+
aria-hidden="true"
|
|
1753
|
+
/>
|
|
1754
|
+
)}
|
|
1745
1755
|
</div>
|
|
1746
1756
|
)}
|
|
1747
1757
|
<div className="relative ml-auto flex-1 md:grow-0 print:hidden flex items-center">
|
|
@@ -1883,7 +1893,7 @@ function Collection({
|
|
|
1883
1893
|
{!formList &&
|
|
1884
1894
|
!relationList?.loadAll &&
|
|
1885
1895
|
tab !== "calendar" &&
|
|
1886
|
-
(hasRangeFilter || currentField) && (
|
|
1896
|
+
(hasRangeFilter || currentField || willHaveRangeRow) && (
|
|
1887
1897
|
<div
|
|
1888
1898
|
className={cn(
|
|
1889
1899
|
relationList
|
|
@@ -1891,12 +1901,22 @@ function Collection({
|
|
|
1891
1901
|
: "lg:hidden 2xl:flex lg:absolute lg:left-1/2 lg:transform lg:-translate-x-1/2 lg:mt-0 mt-2",
|
|
1892
1902
|
)}
|
|
1893
1903
|
>
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1904
|
+
{hasRangeFilter || currentField ? (
|
|
1905
|
+
<DateRangeSelector
|
|
1906
|
+
collection={collection}
|
|
1907
|
+
rangeSelector={rangeSelector}
|
|
1908
|
+
setRangeSelector={setRangeSelector}
|
|
1909
|
+
relationList={!!relationList}
|
|
1910
|
+
/>
|
|
1911
|
+
) : (
|
|
1912
|
+
<div
|
|
1913
|
+
className={cn(
|
|
1914
|
+
"h-9 rounded-md border border-input bg-background shadow-sm",
|
|
1915
|
+
relationList ? "w-[220px]" : "w-[300px]",
|
|
1916
|
+
)}
|
|
1917
|
+
aria-hidden="true"
|
|
1918
|
+
/>
|
|
1919
|
+
)}
|
|
1900
1920
|
</div>
|
|
1901
1921
|
)}
|
|
1902
1922
|
<div
|
package/src/Files.tsx
CHANGED
|
@@ -38,7 +38,7 @@ import {
|
|
|
38
38
|
Edit,
|
|
39
39
|
Trash2,
|
|
40
40
|
Folder,
|
|
41
|
-
File,
|
|
41
|
+
File as FileIcon,
|
|
42
42
|
ChevronRight,
|
|
43
43
|
ArrowLeft,
|
|
44
44
|
Plus,
|
|
@@ -135,7 +135,7 @@ const FileImageThumbnail = ({ storage, fullPath, fileName, pathPrefix }: FileIma
|
|
|
135
135
|
return <div className="h-12 w-12 shrink-0 rounded-md border bg-muted animate-pulse" aria-hidden />
|
|
136
136
|
}
|
|
137
137
|
if (phase === "fallback" || !url) {
|
|
138
|
-
return <
|
|
138
|
+
return <FileIcon className="h-5 w-5 shrink-0 text-gray-500" aria-hidden />
|
|
139
139
|
}
|
|
140
140
|
return (
|
|
141
141
|
<div className="h-12 w-12 shrink-0 rounded-md flex items-center justify-center">
|
|
@@ -781,7 +781,8 @@ export const RecordFiles = ({ collection, record }: FilesProps) => {
|
|
|
781
781
|
return
|
|
782
782
|
}
|
|
783
783
|
|
|
784
|
-
|
|
784
|
+
let finalName = newName.trim()
|
|
785
|
+
const validationError = validateStorageName(finalName)
|
|
785
786
|
if (validationError) {
|
|
786
787
|
toast({ title: "Invalid file name", description: validationError, variant: "destructive" })
|
|
787
788
|
return
|
|
@@ -790,14 +791,39 @@ export const RecordFiles = ({ collection, record }: FilesProps) => {
|
|
|
790
791
|
try {
|
|
791
792
|
setIsRouteLoading("+", location.pathname, true)
|
|
792
793
|
setRenamingFiles((prev) => new Set(prev).add(item.name))
|
|
793
|
-
const pathParts = item.fullPath.split("/")
|
|
794
|
-
pathParts.pop()
|
|
795
|
-
const newPath = [...pathParts, newName].join("/")
|
|
796
794
|
|
|
797
795
|
const originalRef = ref(storage, item.fullPath)
|
|
798
796
|
const downloadURL = await getDownloadURL(originalRef)
|
|
799
797
|
const metadata = await getMetadata(originalRef)
|
|
800
798
|
|
|
799
|
+
const response = await fetch(downloadURL)
|
|
800
|
+
const blob = await response.blob()
|
|
801
|
+
|
|
802
|
+
let uploadContent: Blob = blob
|
|
803
|
+
if (fileOptions?.maxImageWidth) {
|
|
804
|
+
const sourceFile = new File([blob], finalName, {
|
|
805
|
+
type: blob.type || metadata.contentType || "",
|
|
806
|
+
})
|
|
807
|
+
const prepared = await prepareFile(sourceFile, finalName, fileOptions, true)
|
|
808
|
+
uploadContent = prepared.file
|
|
809
|
+
if (prepared.filename !== finalName) {
|
|
810
|
+
const preparedValidationError = validateStorageName(prepared.filename)
|
|
811
|
+
if (preparedValidationError) {
|
|
812
|
+
toast({
|
|
813
|
+
title: "Invalid file name",
|
|
814
|
+
description: preparedValidationError,
|
|
815
|
+
variant: "destructive",
|
|
816
|
+
})
|
|
817
|
+
return
|
|
818
|
+
}
|
|
819
|
+
finalName = prepared.filename
|
|
820
|
+
}
|
|
821
|
+
}
|
|
822
|
+
|
|
823
|
+
const pathParts = item.fullPath.split("/")
|
|
824
|
+
pathParts.pop()
|
|
825
|
+
const newPath = [...pathParts, finalName].join("/")
|
|
826
|
+
|
|
801
827
|
try {
|
|
802
828
|
await runHooks("preFileUpdate", globalConfig, customization, {
|
|
803
829
|
record,
|
|
@@ -807,17 +833,14 @@ export const RecordFiles = ({ collection, record }: FilesProps) => {
|
|
|
807
833
|
return
|
|
808
834
|
}
|
|
809
835
|
|
|
810
|
-
const response = await fetch(downloadURL)
|
|
811
|
-
const blob = await response.blob()
|
|
812
|
-
|
|
813
836
|
const newRef = ref(storage, newPath)
|
|
814
|
-
await uploadBytesResumable(newRef,
|
|
837
|
+
await uploadBytesResumable(newRef, uploadContent, { customMetadata: metadata.customMetadata })
|
|
815
838
|
|
|
816
839
|
await deleteObject(originalRef)
|
|
817
840
|
|
|
818
841
|
toast({
|
|
819
842
|
title: "File renamed",
|
|
820
|
-
description: `${item.name} has been renamed to ${
|
|
843
|
+
description: `${item.name} has been renamed to ${finalName}`,
|
|
821
844
|
})
|
|
822
845
|
|
|
823
846
|
try {
|
|
@@ -848,7 +871,7 @@ export const RecordFiles = ({ collection, record }: FilesProps) => {
|
|
|
848
871
|
setIsRouteLoading("-", location.pathname)
|
|
849
872
|
}
|
|
850
873
|
},
|
|
851
|
-
[currentPath],
|
|
874
|
+
[currentPath, fileOptions],
|
|
852
875
|
)
|
|
853
876
|
|
|
854
877
|
const navigateToFolder = useCallback(
|
|
@@ -1132,7 +1155,7 @@ export const RecordFiles = ({ collection, record }: FilesProps) => {
|
|
|
1132
1155
|
}
|
|
1133
1156
|
/>
|
|
1134
1157
|
) : (
|
|
1135
|
-
<
|
|
1158
|
+
<FileIcon className="h-5 w-5 shrink-0 text-gray-500" />
|
|
1136
1159
|
)}
|
|
1137
1160
|
|
|
1138
1161
|
{editingFile === item.name && !isDisabled ? (
|
package/src/utils/prepareFile.ts
CHANGED
|
@@ -33,6 +33,7 @@ export const prepareFile = async (
|
|
|
33
33
|
file: File,
|
|
34
34
|
preferredFileName: string,
|
|
35
35
|
fileOptions: FileOptions,
|
|
36
|
+
rename: boolean = false,
|
|
36
37
|
): Promise<{ file: File; filename: string }> => {
|
|
37
38
|
if (!file.type.startsWith("image/") || file.type === "image/svg+xml") {
|
|
38
39
|
return { file, filename: preferredFileName }
|
|
@@ -107,7 +108,7 @@ export const prepareFile = async (
|
|
|
107
108
|
blob.size >= file.size &&
|
|
108
109
|
!didDownscale &&
|
|
109
110
|
((usePngOutput && file.type === "image/png") || (!usePngOutput && file.type === "image/jpeg"))
|
|
110
|
-
if (noBenefit) {
|
|
111
|
+
if (noBenefit && !rename) {
|
|
111
112
|
return { file, filename: preferredFileName }
|
|
112
113
|
}
|
|
113
114
|
|