@bindu-dashing/dam-solution-v2 5.8.151 → 5.8.154
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.
|
@@ -12,7 +12,7 @@ import { Button, Checkbox, Drawer, Form, Input, Select, Typography } from "antd"
|
|
|
12
12
|
import { useEffect, useMemo, useState } from "react";
|
|
13
13
|
import { ACCESS_TYPES, DAM_LOCATION_TYPES } from "../hocs/appConstants";
|
|
14
14
|
import { useDamConfig } from "../hocs/DamConfigContext";
|
|
15
|
-
import { CREATE_SUB_BRAND } from "../utilities/constants/apiUrls";
|
|
15
|
+
import { CREATE_SUB_BRAND, FETCH_BRAND_USING_SUBDOMAIN } from "../utilities/constants/apiUrls";
|
|
16
16
|
import axios from "axios";
|
|
17
17
|
import { createApiClient } from "../hocs/configureAxios";
|
|
18
18
|
import { CREATE_SUCCESS, SOMETHING_WENT_WRONG, } from "../utilities/constants/messages";
|
|
@@ -21,10 +21,12 @@ import { showNotification } from "../common/notifications";
|
|
|
21
21
|
import { get } from "lodash";
|
|
22
22
|
const CreateClientForm = ({ teamsApi, username, password, toggleShow, onSuccess, clientSubdomain, existingClientData, }) => {
|
|
23
23
|
const damConfig = useDamConfig();
|
|
24
|
-
const { appType } = damConfig;
|
|
24
|
+
const { appType, brand } = damConfig;
|
|
25
25
|
const [loading, setLoading] = useState(false);
|
|
26
|
+
const [fetchingClientData, setFetchingClientData] = useState(false);
|
|
26
27
|
const [damLocationType, setDamLocationType] = useState("external");
|
|
27
28
|
const [filteredTeams, setFilteredTeams] = useState([]);
|
|
29
|
+
const [clientData, setClientData] = useState(null);
|
|
28
30
|
const api = useMemo(() => createApiClient(damConfig), [damConfig]);
|
|
29
31
|
const [form] = Form.useForm();
|
|
30
32
|
const isEditMode = !!existingClientData;
|
|
@@ -32,14 +34,51 @@ const CreateClientForm = ({ teamsApi, username, password, toggleShow, onSuccess,
|
|
|
32
34
|
setDamLocationType(e);
|
|
33
35
|
form.setFieldValue("dam_location_details", { type: e });
|
|
34
36
|
};
|
|
37
|
+
// Fetch client data when editing
|
|
35
38
|
useEffect(() => {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
39
|
+
const fetchClientData = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
40
|
+
if (isEditMode && (existingClientData === null || existingClientData === void 0 ? void 0 : existingClientData.subdomain)) {
|
|
41
|
+
setFetchingClientData(true);
|
|
42
|
+
try {
|
|
43
|
+
const response = yield api.get(`${FETCH_BRAND_USING_SUBDOMAIN}?subdomain=${existingClientData.subdomain}`);
|
|
44
|
+
// API response structure: { status: true, code: 200, data: { _id, name, adminTeams, subdomain, ... } }
|
|
45
|
+
const fetchedData = get(response, "data.data", {});
|
|
46
|
+
console.log("Fetched client data:", fetchedData);
|
|
47
|
+
// Store client data in state
|
|
48
|
+
setClientData(fetchedData);
|
|
49
|
+
// Populate form with existing client data
|
|
50
|
+
if (fetchedData && Object.keys(fetchedData).length > 0) {
|
|
51
|
+
const damLocationDetails = get(fetchedData, "damLocationDetails", {});
|
|
52
|
+
const locationType = get(damLocationDetails, "locationType", "");
|
|
53
|
+
// Set DAM location type state first
|
|
54
|
+
if (locationType === "EXTERNAL") {
|
|
55
|
+
setDamLocationType("external");
|
|
56
|
+
}
|
|
57
|
+
else if (locationType === "INTERNAL") {
|
|
58
|
+
setDamLocationType("internal");
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
setDamLocationType("external"); // default
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
catch (error) {
|
|
66
|
+
console.error("Error fetching client data:", error);
|
|
67
|
+
// If fetch fails, still set subdomain
|
|
68
|
+
if (existingClientData === null || existingClientData === void 0 ? void 0 : existingClientData.subdomain) {
|
|
69
|
+
form.setFieldValue("subdomain", existingClientData.subdomain);
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
finally {
|
|
73
|
+
setFetchingClientData(false);
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
else if (clientSubdomain) {
|
|
77
|
+
form.setFieldValue("subdomain", clientSubdomain);
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
fetchClientData();
|
|
81
|
+
}, [isEditMode, existingClientData, api, form, filteredTeams]);
|
|
43
82
|
const onFinish = (data) => __awaiter(void 0, void 0, void 0, function* () {
|
|
44
83
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
45
84
|
try {
|
|
@@ -81,6 +120,37 @@ const CreateClientForm = ({ teamsApi, username, password, toggleShow, onSuccess,
|
|
|
81
120
|
showNotification(get(error, "message", SOMETHING_WENT_WRONG), NotificationStatus.ERROR);
|
|
82
121
|
}
|
|
83
122
|
});
|
|
123
|
+
// Populate form when client data and teams are ready
|
|
124
|
+
useEffect(() => {
|
|
125
|
+
if (clientData && Object.keys(clientData).length > 0) {
|
|
126
|
+
const damLocationDetails = get(clientData, "damLocationDetails", {});
|
|
127
|
+
const locationType = get(damLocationDetails, "locationType", "");
|
|
128
|
+
// Convert adminTeams to numbers if they're strings, to match Select component values
|
|
129
|
+
const adminTeamsData = get(clientData, "adminTeams", []);
|
|
130
|
+
const adminTeamsFormatted = Array.isArray(adminTeamsData)
|
|
131
|
+
? adminTeamsData.map((team) => {
|
|
132
|
+
const teamNum = typeof team === "string" ? Number(team) : team;
|
|
133
|
+
return teamNum;
|
|
134
|
+
})
|
|
135
|
+
: [];
|
|
136
|
+
form.setFieldsValue({
|
|
137
|
+
name: get(clientData, "name", ""),
|
|
138
|
+
subdomain: get(clientData, "subdomain", (existingClientData === null || existingClientData === void 0 ? void 0 : existingClientData.subdomain) || ""),
|
|
139
|
+
accessTypes: get(clientData, "accessTypes", []),
|
|
140
|
+
adminTeams: adminTeamsFormatted,
|
|
141
|
+
showFilePreview: get(clientData, "showFilePreview", false),
|
|
142
|
+
damLocationDetails: {
|
|
143
|
+
type: locationType === "EXTERNAL" ? "external" : locationType === "INTERNAL" ? "internal" : "external",
|
|
144
|
+
bucket: get(damLocationDetails, "bucket", ""),
|
|
145
|
+
rootPath: get(damLocationDetails, "rootPath", ""),
|
|
146
|
+
accessKeyId: get(damLocationDetails, "accessKeyId", ""),
|
|
147
|
+
secretAccessKey: get(damLocationDetails, "secretAccessKey", ""),
|
|
148
|
+
url: get(damLocationDetails, "url", ""),
|
|
149
|
+
region: get(damLocationDetails, "region", ""),
|
|
150
|
+
},
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
}, [clientData, filteredTeams, form, existingClientData]);
|
|
84
154
|
useEffect(() => {
|
|
85
155
|
if (teamsApi && username && password) {
|
|
86
156
|
fetchTeams();
|
|
@@ -107,7 +177,10 @@ const CreateClientForm = ({ teamsApi, username, password, toggleShow, onSuccess,
|
|
|
107
177
|
console.log("Error while fetching external teams", err);
|
|
108
178
|
}
|
|
109
179
|
});
|
|
110
|
-
|
|
180
|
+
// Debug: Log edit mode and location type
|
|
181
|
+
const shouldShowExternalFields = damLocationType === "external" || isEditMode;
|
|
182
|
+
console.log("CreateClientForm - isEditMode:", isEditMode, "damLocationType:", damLocationType, "shouldShowExternalFields:", shouldShowExternalFields, "existingClientData:", existingClientData);
|
|
183
|
+
return (_jsx(Drawer, { open: true, title: isEditMode ? "Edit Client" : "Create Client", onClose: toggleShow, width: 500, maskClosable: false, children: fetchingClientData ? (_jsx("div", { style: { textAlign: "center", padding: "20px" }, children: _jsx(Typography.Text, { children: "Loading client data..." }) })) : (_jsxs(Form, { layout: "vertical", form: form, onFinish: onFinish, children: [_jsx(Form.Item, { label: "Name", name: "name", rules: [
|
|
111
184
|
{
|
|
112
185
|
required: true,
|
|
113
186
|
message: "Name is required",
|
|
@@ -129,41 +202,41 @@ const CreateClientForm = ({ teamsApi, username, password, toggleShow, onSuccess,
|
|
|
129
202
|
},
|
|
130
203
|
], children: _jsx(Select, { options: DAM_LOCATION_TYPES, onChange: (e) => {
|
|
131
204
|
onChangeDamLocationType(e);
|
|
132
|
-
}, placeholder: "Type" }) }),
|
|
205
|
+
}, placeholder: "Type" }) }), shouldShowExternalFields && (_jsxs(_Fragment, { children: [_jsx(Form.Item, { label: "Bucket", name: ["damLocationDetails", "bucket"], rules: [
|
|
133
206
|
{
|
|
134
|
-
required:
|
|
207
|
+
required: damLocationType === "external",
|
|
135
208
|
message: "Bucket is required",
|
|
136
209
|
},
|
|
137
|
-
], children: _jsx(Input, { placeholder: "Bucket" }) }), _jsx(Form.Item, { label: "Root Path", name: ["damLocationDetails", "rootPath"], rules: [
|
|
210
|
+
], children: _jsx(Input, { placeholder: "Bucket", disabled: damLocationType === "internal" }) }), _jsx(Form.Item, { label: "Root Path", name: ["damLocationDetails", "rootPath"], rules: [
|
|
138
211
|
{
|
|
139
|
-
required:
|
|
212
|
+
required: damLocationType === "external",
|
|
140
213
|
message: "Root path is required",
|
|
141
214
|
},
|
|
142
|
-
], children: _jsx(Input, { placeholder: "Root path" }) }), _jsx(Form.Item, { label: "Access Key", name: ["damLocationDetails", "accessKeyId"], rules: [
|
|
215
|
+
], children: _jsx(Input, { placeholder: "Root path", disabled: damLocationType === "internal" }) }), _jsx(Form.Item, { label: "Access Key", name: ["damLocationDetails", "accessKeyId"], rules: [
|
|
143
216
|
{
|
|
144
|
-
required:
|
|
217
|
+
required: damLocationType === "external",
|
|
145
218
|
message: "Access key is required",
|
|
146
219
|
},
|
|
147
|
-
], children: _jsx(Input, { placeholder: "Access Key" }) }), _jsx(Form.Item, { label: "Secret Access Key", name: ["damLocationDetails", "secretAccessKey"], rules: [
|
|
220
|
+
], children: _jsx(Input, { placeholder: "Access Key", disabled: damLocationType === "internal" }) }), _jsx(Form.Item, { label: "Secret Access Key", name: ["damLocationDetails", "secretAccessKey"], rules: [
|
|
148
221
|
{
|
|
149
|
-
required:
|
|
222
|
+
required: damLocationType === "external",
|
|
150
223
|
message: "Secret Access Key is required",
|
|
151
224
|
},
|
|
152
|
-
], children: _jsx(Input, { placeholder: "Secret Key" }) }), _jsx(Form.Item, { label: "Url", name: ["damLocationDetails", "url"], rules: [
|
|
225
|
+
], children: _jsx(Input, { placeholder: "Secret Key", disabled: damLocationType === "internal" }) }), _jsx(Form.Item, { label: "Url", name: ["damLocationDetails", "url"], rules: [
|
|
153
226
|
{
|
|
154
|
-
required:
|
|
227
|
+
required: damLocationType === "external",
|
|
155
228
|
message: "Url is required",
|
|
156
229
|
},
|
|
157
|
-
], children: _jsx(Input, { placeholder: "Url" }) }), _jsx(Form.Item, { label: "Region", name: ["damLocationDetails", "region"], rules: [
|
|
230
|
+
], children: _jsx(Input, { placeholder: "Url", disabled: damLocationType === "internal" }) }), _jsx(Form.Item, { label: "Region", name: ["damLocationDetails", "region"], rules: [
|
|
158
231
|
{
|
|
159
|
-
required:
|
|
232
|
+
required: damLocationType === "external",
|
|
160
233
|
message: "Region is required",
|
|
161
234
|
},
|
|
162
|
-
], children: _jsx(Input, { placeholder: "Region" }) })] }))] }), _jsx(Form.Item, { label: "Subdomain", name: "subdomain", rules: [
|
|
235
|
+
], children: _jsx(Input, { placeholder: "Region", disabled: damLocationType === "internal" }) })] }))] }), _jsx(Form.Item, { label: "Subdomain", name: "subdomain", rules: [
|
|
163
236
|
{
|
|
164
237
|
required: true,
|
|
165
238
|
message: "Subdomain is required",
|
|
166
239
|
},
|
|
167
|
-
], children: _jsx(Input, { placeholder: "Subdomain" }) }), _jsx(Form.Item, { name: "showFilePreview", valuePropName: "checked", initialValue: false, children: _jsx(Checkbox, { children: "Show File Preview" }) }), _jsx(Form.Item, { children: _jsx(Button, { htmlType: "submit", type: "primary", block: true, loading: loading, children: "Submit" }) })] }) }));
|
|
240
|
+
], children: _jsx(Input, { placeholder: "Subdomain" }) }), _jsx(Form.Item, { name: "showFilePreview", valuePropName: "checked", initialValue: false, children: _jsx(Checkbox, { children: "Show File Preview Editor" }) }), _jsx(Form.Item, { children: _jsx(Button, { htmlType: "submit", type: "primary", block: true, loading: loading, children: "Submit" }) })] })) }));
|
|
168
241
|
};
|
|
169
242
|
export default CreateClientForm;
|
|
@@ -1,12 +1,17 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Layout, Button } from "antd";
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import { LeftOutlined, RightOutlined } from "@ant-design/icons";
|
|
5
5
|
import PreviewDetails from "./Previewdetails";
|
|
6
6
|
import MapFile from "../files/MapFile";
|
|
7
|
+
import { useDamConfig } from "../../hocs/DamConfigContext";
|
|
8
|
+
import { get } from "lodash";
|
|
7
9
|
const { Content } = Layout;
|
|
8
10
|
const FileViewer = ({ file, onNext, onPrev, hasNext, hasPrev, handleClose, }) => {
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
+
const damConfig = useDamConfig();
|
|
12
|
+
const brand = damConfig === null || damConfig === void 0 ? void 0 : damConfig.brand;
|
|
13
|
+
const showFilePreview = get(brand, "showFilePreview", false);
|
|
14
|
+
const [metadataOpen, setMetadataOpen] = useState(showFilePreview);
|
|
15
|
+
return (_jsx(Layout, { className: "md-lib-h-full", children: _jsxs(Content, { className: "md-lib-flex md-lib-h-full md-lib-w-full", children: [_jsx("div", { className: `md-lib-flex md-lib-items-center md-lib-justify-center md-lib-relative md-lib-bg-textColorActive dark:md-lib-bg-darkSecondaryColor md-lib-min-h-full ${metadataOpen ? "md-lib-flex-1" : "md-lib-flex-1 md-lib-w-full"}`, children: _jsx(PreviewDetails, { file: file, hasNext: hasNext, hasPrev: hasPrev, onNext: onNext, onPrev: onPrev }) }), showFilePreview && (_jsxs(_Fragment, { children: [_jsx(Button, { type: "text", className: "md-lib-shrink-0 md-lib-flex md-lib-items-center md-lib-justify-center md-lib-w-10 md-lib-h-10 md-lib-rounded-none md-lib-bg-black/50 hover:md-lib-bg-black/70 dark:md-lib-bg-white/20 dark:hover:md-lib-bg-white/30 md-lib-text-white md-lib-border-0 md-lib-self-start md-lib-mt-4", onClick: () => setMetadataOpen((prev) => !prev), "aria-label": metadataOpen ? "Hide showFilePreviewEditor" : "Show showFilePreviewEditor", children: metadataOpen ? (_jsx(RightOutlined, { className: "md-lib-text-lg" })) : (_jsx(LeftOutlined, { className: "md-lib-text-lg" })) }), metadataOpen && (_jsx("div", { className: "md-lib-w-[400px] md-lib-min-w-[320px] md-lib-shrink-0 md-lib-border-l md-lib-border-borderColor dark:md-lib-border-darkBorderColor md-lib-bg-backgroundColor dark:md-lib-bg-darkPrimary md-lib-overflow-y-auto", children: _jsx(MapFile, { fromUpload: false, filesList: file ? [file] : [], handleCancel: handleClose ? () => handleClose() : undefined }) }))] }))] }) }));
|
|
11
16
|
};
|
|
12
17
|
export default FileViewer;
|
|
@@ -231,6 +231,6 @@ function MapFile({ open, handleCancel, filesList, fromUpload, parentFolderId, })
|
|
|
231
231
|
const getMetadataForm = (_jsxs(Form, { layout: "vertical", form: form, scrollToFirstError: true, onFinish: fromUpload ? handleSubmit : handleUpdate, className: "md-lib-m-2", children: [_jsx(AssetSelectionFormItem, { handleAssetTemplateChange: handleAssetTemplateChange, assetOptions: assetOptions, assetsLoading: assetsLoading }), selectedAssetTemplate && (_jsxs(_Fragment, { children: [_jsx(Form.Item, { name: "teamIds", label: "Teams", children: _jsx(Select, { options: teamOptions, placeholder: "Select teams", mode: "multiple", onChange: (val) => onChangeTeams(val), style: { width: "100%" }, showSearch: true, optionFilterProp: "key" }) }), _jsx(Form.Item, { name: "expiryDate", label: "Expiry Date", children: _jsx(DatePicker, { placeholder: "Expiry Date", style: { width: "100%" } }) }), _jsx(Metadata, { asset: selectedAssetTemplate, form: form, file: (filesList === null || filesList === void 0 ? void 0 : filesList[0]) || null })] })), _jsxs("div", { className: "md-lib-flex md-lib-items-center md-lib-justify-end md-lib-gap-3", children: [_jsx(Button, { onClick: handleCancelWithConfirmation, children: "Cancel" }), _jsx(Button, { disabled: !selectedAssetTemplate, type: "primary",
|
|
232
232
|
// onClick={handleSubmit}
|
|
233
233
|
loading: loading || updateFileMutation.isLoading, htmlType: "submit", children: "Save" })] })] }));
|
|
234
|
-
return (_jsx(_Fragment, { children: fromUpload ? (_jsx(Drawer, { title: "
|
|
234
|
+
return (_jsx(_Fragment, { children: fromUpload ? (_jsx(Drawer, { title: "showFilePreviewEditor", open: open, onClose: handleCancelWithConfirmation, maskClosable: false, children: getMetadataForm })) : (_jsxs("div", { className: "md-lib-p-2 md-lib-overflow-y-scroll md-lib-max-h-[calc(100vh-65px)]", children: [_jsx("p", { className: "md-lib-text-lg md-lib-font-semibold", children: "showFilePreviewEditor" }), getMetadataForm] })) }));
|
|
235
235
|
}
|
|
236
236
|
export default MapFile;
|