Skip to content

Commit 1d69147

Browse files
[CP-3864] keep selected files on preview (#2645)
Co-authored-by: Michał Kurczewski <[email protected]> Co-authored-by: Michał Kurczewski <[email protected]>
1 parent 4ab382e commit 1d69147

File tree

8 files changed

+130
-75
lines changed

8 files changed

+130
-75
lines changed

libs/generic-view/models/src/lib/common-validators.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,7 @@ export const entityActionValidator = z.union([
9999
type: z.literal("entities-delete"),
100100
entitiesType: z.string(),
101101
ids: z.array(z.string()),
102+
activeItemId: z.string().optional(),
102103
successMessage: z.string().optional(),
103104
postActions: z
104105
.object({
@@ -200,7 +201,7 @@ const filesTransferExportFilesActionValidator = z.object({
200201
type: z.literal("export-files"),
201202
destinationPath: z.string(),
202203
entitiesType: z.string().optional(),
203-
singleEntityId: z.string().optional(),
204+
activeItemId: z.string().optional(),
204205
actionId: z.string(),
205206

206207
formOptions: z.object({

libs/generic-view/ui/src/lib/buttons/button-base/use-button-action.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -259,7 +259,7 @@ const runActions = (actions?: ButtonActions) => {
259259
await dispatch(
260260
deleteEntitiesDataAction({
261261
entitiesType: action.entitiesType,
262-
ids: action.ids,
262+
ids: action.activeItemId ? [action.activeItemId] : action.ids,
263263
deviceId: activeDeviceId,
264264
successMessage: action.successMessage,
265265
onSuccess: () => {

libs/generic-view/ui/src/lib/buttons/button-base/use-export-files-button-action.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,11 +43,10 @@ export const useExportFilesButtonAction = () => {
4343
}
4444
) => {
4545
const form = getFormContext(action.formOptions.formKey)
46-
4746
if (action.entitiesType === undefined) return
4847
if (deviceId === undefined) return
49-
const selectedItems: string[] = action.singleEntityId
50-
? [action.singleEntityId]
48+
const selectedItems: string[] = action.activeItemId
49+
? [action.activeItemId]
5150
: getFormContext(action.sourceFormKey).getValues(
5251
action.selectedItemsFieldName
5352
)

libs/generic-view/ui/src/lib/generated/mc-file-manager/delete-files.ts

Lines changed: 87 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,17 @@ export const generateDeleteFilesButtonActions = (
1616
{
1717
type: "form-set-field",
1818
formKey: `${key}fileListForm`,
19-
key: "selectedItems",
20-
value: [singleEntityId],
19+
key: "activeItemId",
20+
value: singleEntityId,
2121
},
2222
] as ButtonTextConfig["actions"])
2323
: []),
2424
{
2525
type: "open-modal",
26-
modalKey: `${key}deleteModal`,
26+
modalKey:
27+
singleEntityId !== undefined
28+
? `${key}deletePreviewModal`
29+
: `${key}deleteModal`,
2730
domain: "files-delete",
2831
},
2932
]
@@ -35,26 +38,36 @@ export const generateDeleteFiles: ComponentGenerator<{
3538
return {
3639
[`${key}deleteModal`]: {
3740
component: "modal",
38-
config: {
39-
size: "small",
40-
},
41+
config: { size: "small" },
4142
childrenKeys: [
4243
`${key}deleteModalIcon`,
4344
`${key}deleteModalTitle`,
4445
`${key}deleteModalContent`,
4546
`${key}deleteModalButtons`,
4647
],
4748
},
49+
[`${key}deletePreviewModal`]: {
50+
component: "modal",
51+
config: { size: "small" },
52+
childrenKeys: [
53+
`${key}deleteModalIcon`,
54+
`${key}deletePreviewModalTitle`,
55+
`${key}deletePreviewModalContent`,
56+
`${key}deletePreviewModalButtons`,
57+
],
58+
},
4859
[`${key}deleteModalIcon`]: {
4960
component: "modal.titleIcon",
50-
config: {
51-
type: IconType.Exclamation,
52-
},
61+
config: { type: IconType.Exclamation },
5362
},
5463
[`${key}deleteModalTitle`]: {
5564
component: "modal.title",
5665
childrenKeys: [`${key}deleteModalTitleText`],
5766
},
67+
[`${key}deletePreviewModalTitle`]: {
68+
component: "modal.title",
69+
childrenKeys: [`${key}deletePreviewModalTitleText`],
70+
},
5871
[`${key}deleteModalTitleText`]: {
5972
component: "format-message",
6073
config: {
@@ -73,6 +86,10 @@ export const generateDeleteFiles: ComponentGenerator<{
7386
],
7487
},
7588
},
89+
[`${key}deletePreviewModalTitleText`]: {
90+
component: "format-message",
91+
config: { messageTemplate: "Delete file?" },
92+
},
7693
[`${key}deleteModalContent`]: {
7794
component: "typography.p1",
7895
config: {
@@ -91,13 +108,24 @@ export const generateDeleteFiles: ComponentGenerator<{
91108
],
92109
},
93110
},
111+
[`${key}deletePreviewModalContent`]: {
112+
component: "typography.p1",
113+
config: { text: "This will remove the file from Kompakt" },
114+
},
94115
[`${key}deleteModalButtons`]: {
95116
component: "modal.buttons",
96117
childrenKeys: [
97118
`${key}deleteModalCancelButton`,
98119
`${key}deleteModalConfirmButton`,
99120
],
100121
},
122+
[`${key}deletePreviewModalButtons`]: {
123+
component: "modal.buttons",
124+
childrenKeys: [
125+
`${key}deleteModalCancelButton`,
126+
`${key}deletePreviewModalConfirmButton`,
127+
],
128+
},
101129
[`${key}deleteModalCancelButton`]: {
102130
component: "button-secondary",
103131
config: {
@@ -127,31 +155,19 @@ export const generateDeleteFiles: ComponentGenerator<{
127155
"{count, plural, one {# file} other {# files}} deleted",
128156
postActions: {
129157
success: [
130-
{
131-
type: "close-domain-modals",
132-
domain: "files-delete",
133-
},
158+
{ type: "close-domain-modals", domain: "files-delete" },
134159
],
135160
failure: [
136-
{
137-
type: "close-domain-modals",
138-
domain: "files-delete",
139-
},
140-
{
141-
type: "open-modal",
142-
modalKey: `${key}deleteErrorModal`,
143-
},
161+
{ type: "close-domain-modals", domain: "files-delete" },
162+
{ type: "open-modal", modalKey: `${key}deleteErrorModal` },
144163
],
145164
},
146165
},
147166
],
148167
},
149168
childrenKeys: [`${key}deleteModalConfirmButtonText`],
150169
layout: {
151-
flexLayout: {
152-
direction: "row",
153-
justifyContent: "center",
154-
},
170+
flexLayout: { direction: "row", justifyContent: "center" },
155171
},
156172
dataProvider: {
157173
source: "form-fields",
@@ -182,6 +198,52 @@ export const generateDeleteFiles: ComponentGenerator<{
182198
],
183199
},
184200
},
201+
[`${key}deletePreviewModalConfirmButton`]: {
202+
component: "button-primary",
203+
config: {
204+
actions: [
205+
{
206+
type: "open-modal",
207+
modalKey: `${key}deleteProgressModal`,
208+
domain: "files-delete",
209+
},
210+
{
211+
type: "entities-delete",
212+
entitiesType: entityType,
213+
ids: [],
214+
activeItemId: undefined,
215+
successMessage: "1 file deleted",
216+
postActions: {
217+
success: [
218+
{ type: "close-domain-modals", domain: "files-delete" },
219+
],
220+
failure: [
221+
{ type: "close-domain-modals", domain: "files-delete" },
222+
{ type: "open-modal", modalKey: `${key}deleteErrorModal` },
223+
],
224+
},
225+
},
226+
],
227+
},
228+
childrenKeys: [`${key}deletePreviewModalConfirmButtonText`],
229+
layout: {
230+
flexLayout: { direction: "row", justifyContent: "center" },
231+
},
232+
dataProvider: {
233+
source: "form-fields",
234+
formKey: `${key}fileListForm`,
235+
fields: [
236+
{
237+
providerField: "activeItemId",
238+
componentField: "config.actions[1].activeItemId",
239+
},
240+
],
241+
},
242+
},
243+
[`${key}deletePreviewModalConfirmButtonText`]: {
244+
component: "format-message",
245+
config: { messageTemplate: "Delete file" },
246+
},
185247
[`${key}deleteProgressModal`]: {
186248
component: "modal",
187249
config: {

libs/generic-view/ui/src/lib/generated/mc-file-manager/file-export-button.ts

Lines changed: 33 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ export const generateFilesExportButtonActions = (
3434
{
3535
type: "form-set-field",
3636
formKey: `${key}fileListForm`,
37-
key: "selectedItems",
38-
value: [singleEntityId],
37+
key: "activeItemId",
38+
value: singleEntityId,
3939
},
4040
] as ButtonTextConfig["actions"])
4141
: []),
@@ -53,8 +53,8 @@ export const generateFilesExportButtonActions = (
5353
{
5454
type: "form-set-field",
5555
formKey: `${key}fileListForm`,
56-
key: "selectedItems",
57-
value: [],
56+
key: "activeItemId",
57+
value: undefined,
5858
},
5959
],
6060
},
@@ -75,7 +75,7 @@ export const generateFilesExportButtonActions = (
7575
sourceFormKey: `${key}fileListForm`,
7676
selectedItemsFieldName: "selectedItems",
7777
entitiesType: entityType,
78-
singleEntityId,
78+
activeItemId: singleEntityId,
7979
actionId: exportActionId,
8080
preActions: {
8181
validationFailure: [
@@ -96,18 +96,24 @@ export const generateFilesExportButtonActions = (
9696
},
9797
{
9898
type: "open-toast",
99-
toastKey: `${key}FilesExportedToast`,
100-
},
101-
{
102-
type: "form-set-field",
103-
formKey: `${key}fileListForm`,
104-
key: "selectedItems",
105-
value: [],
99+
toastKey: singleEntityId
100+
? `${key}FilesExportedFromPreviewToast`
101+
: `${key}FilesExportedToast`,
106102
},
103+
...(singleEntityId === undefined
104+
? [
105+
{
106+
type: "form-set-field" as const,
107+
formKey: `${key}fileListForm`,
108+
key: "selectedItems",
109+
value: [],
110+
},
111+
]
112+
: []),
107113
],
108114
failure: [
109115
{
110-
type: "form-set-field",
116+
type: "form-set-field" as const,
111117
formKey: `${key}fileListForm`,
112118
key: "selectedItems",
113119
value: [],
@@ -258,5 +264,19 @@ export const generateFileExportProcessButton: ComponentGenerator<
258264
],
259265
},
260266
},
267+
[`${key}FilesExportedFromPreviewToast`]: {
268+
component: "toast",
269+
childrenKeys: [
270+
`${key}FilesExportedToastIcon`,
271+
`${key}FilesExportedFromPreviewToastText`,
272+
],
273+
},
274+
275+
[`${key}FilesExportedFromPreviewToastText`]: {
276+
component: "typography.p1",
277+
config: {
278+
text: "1 file exported",
279+
},
280+
},
261281
}
262282
}

libs/generic-view/ui/src/lib/generated/mc-file-manager/file-list.ts

Lines changed: 1 addition & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@ const generateFileList: ComponentGenerator<
7171
activeFilePath: null,
7272
exportPath: "",
7373
previewMode: false,
74+
activeItemId: undefined,
7475
},
7576
},
7677
},
@@ -159,12 +160,6 @@ const generateFileList: ComponentGenerator<
159160
condition: "eq",
160161
value: 0,
161162
},
162-
{
163-
providerField: "previewMode",
164-
componentField: "data.render[1]",
165-
condition: "eq",
166-
value: true,
167-
},
168163
],
169164
},
170165
},
@@ -228,12 +223,6 @@ const generateFileList: ComponentGenerator<
228223
condition: "gt",
229224
value: 0,
230225
},
231-
{
232-
providerField: "previewMode",
233-
componentField: "data.render[1]",
234-
condition: "eq",
235-
value: false,
236-
},
237226
],
238227
},
239228
},
@@ -512,18 +501,6 @@ const generateFileList: ComponentGenerator<
512501
},
513502
],
514503
},
515-
dataProviderSecondary: {
516-
source: "form-fields",
517-
formKey: `${key}${id}fileListForm`,
518-
fields: [
519-
{
520-
providerField: "previewMode",
521-
componentField: "config.inactive",
522-
condition: "eq",
523-
value: true,
524-
},
525-
],
526-
},
527504
},
528505
[`${key}${id}columnName`]: {
529506
component: "table.cell",

libs/generic-view/ui/src/lib/interactive/form/input/checkbox-input.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -223,8 +223,8 @@ const InputBox = styled.div`
223223
`
224224

225225
const HitArea = styled.label`
226-
width: 3.2rem;
227-
height: 3.2rem;
226+
width: 5rem;
227+
height: 5rem;
228228
position: absolute;
229229
opacity: 0.1;
230230
left: 50%;

0 commit comments

Comments
 (0)