@orangelogic/orange-dam-content-browser-sdk 2.1.20 → 2.1.22

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/CBSDKdemo.html CHANGED
@@ -6,9 +6,9 @@
6
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
7
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />
8
8
 
9
- <script src="https://downloads.orangelogic.com/ContentBrowserSDK/v2.1.20/OrangeDAMContentBrowserSDK.min.js"></script>
9
+ <script src="https://downloads.orangelogic.com/ContentBrowserSDK/v2.1.22/OrangeDAMContentBrowserSDK.min.js"></script>
10
10
  <link rel="stylesheet" type="text/css"
11
- href="https://downloads.orangelogic.com/ContentBrowserSDK/v2.1.20/OrangeDAMContentBrowserSDK.min.css">
11
+ href="https://downloads.orangelogic.com/ContentBrowserSDK/v2.1.22/OrangeDAMContentBrowserSDK.min.css">
12
12
 
13
13
  <style>
14
14
  * {
@@ -3,9 +3,9 @@
3
3
 
4
4
  <head>
5
5
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&amp;display=swap">
6
- <script src="https://downloads.orangelogic.com/Cortex/AssetBrowser/v2.1.20/OrangeDamAssetBrowser.min.js"></script>
6
+ <script src="https://downloads.orangelogic.com/Cortex/AssetBrowser/v2.1.22/OrangeDamAssetBrowser.min.js"></script>
7
7
  <link rel="stylesheet" type="text/css"
8
- href="https://downloads.orangelogic.com/Cortex/AssetBrowser/v2.1.20/OrangeDamAssetBrowser.min.css">
8
+ href="https://downloads.orangelogic.com/Cortex/AssetBrowser/v2.1.22/OrangeDamAssetBrowser.min.css">
9
9
  <style>
10
10
  #orangelogic-GAB-browser-wrapper {
11
11
  min-width: 382px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@orangelogic/orange-dam-content-browser-sdk",
3
- "version": "2.1.20",
3
+ "version": "2.1.22",
4
4
  "description": "OrangeDAM Content Browser SDK source code",
5
5
  "main": "index.js",
6
6
  "homepage": "/",
package/src/App.tsx CHANGED
@@ -34,8 +34,8 @@ import '@orangelogic-private/design-system/components/tree';
34
34
  import '@orangelogic-private/design-system/components/tree-item';
35
35
  import '@orangelogic-private/design-system/components/typography';
36
36
  import '@orangelogic-private/design-system/css/ol-light.css';
37
-
38
37
  import '@orangelogic-private/design-system/react-types';
38
+
39
39
  import { FC, useCallback, useEffect, useMemo, useState } from 'react';
40
40
  import styled from 'styled-components';
41
41
  import WebFont from 'webfontloader';
@@ -43,6 +43,9 @@ import WebFont from 'webfontloader';
43
43
  import { AppContext, AppContextType } from '@/AppContext';
44
44
  import AssetsPicker from '@/view/AssetsPicker';
45
45
 
46
+ import { useAppSelector } from './store';
47
+ import { accessTokenSelector } from './store/auth/auth.slice';
48
+
46
49
  type Props = {
47
50
  containerId?: string;
48
51
  extraFields?: string[];
@@ -60,6 +63,7 @@ type Props = {
60
63
  onAssetSelected: AppContextType['onAssetSelected'];
61
64
  onImageSelected: AppContextType['onImageSelected'];
62
65
  onConnectClicked: () => void;
66
+ onTokenChanged?: (token: string) => void;
63
67
  };
64
68
 
65
69
  const Container = styled.div<{ open?: boolean }>`
@@ -84,7 +88,9 @@ export const App: FC<Props> = ({
84
88
  onAssetSelected,
85
89
  onImageSelected,
86
90
  onConnectClicked,
91
+ onTokenChanged,
87
92
  }) => {
93
+ const accessToken = useAppSelector(accessTokenSelector);
88
94
  const [open, setOpen] = useState(true);
89
95
 
90
96
  useEffect(() => {
@@ -106,6 +112,12 @@ export const App: FC<Props> = ({
106
112
  }
107
113
  }, [loadExternalFonts]);
108
114
 
115
+ useEffect(() => {
116
+ if (onTokenChanged && accessToken) {
117
+ onTokenChanged(accessToken);
118
+ }
119
+ }, [accessToken, onTokenChanged]);
120
+
109
121
  const handleClose = useCallback(() => {
110
122
  setOpen(false);
111
123
  onClose?.();
package/src/AppContext.ts CHANGED
@@ -9,6 +9,7 @@ export type AppContextType = {
9
9
  onError: (errorMessage?: string, error?: Error) => void;
10
10
  onClose: () => void;
11
11
  onConnectClicked: () => void;
12
+ onTokenChanged?: (token: string) => void;
12
13
  };
13
14
 
14
15
  export const AppContext = createContext<AppContextType>({
@@ -12,6 +12,8 @@ export const FIELD_SCRUB_URL = 'ScrubURL';
12
12
  export const FIELD_SUBTYPE = 'CoreField.DocSubType';
13
13
  export const FIELD_TITLE_WITH_FALLBACK = 'CoreField.TitleWithFallback';
14
14
  export const FIELD_HAS_BROWSER_CHILDREN = 'Document.HasBrowserChildren';
15
+ export const FIELD_ORIGINAL_FILE_NAME = 'CoreField.OriginalFileName';
16
+ export const FIELD_UPDATED_FILE_NAME = 'CoreField.UpdatedFileName';
15
17
  export const LIBRARY_NAME = 'Library';
16
18
  export const MESSAGE_NEW_LINE = '\n';
17
19
  export const ORIGINAL_VIEW_SIZE = 'CoreField.OriginalPreview';
package/src/index.tsx CHANGED
@@ -50,14 +50,18 @@ type OrangeDAMContentBrowser = {
50
50
  * Callback when we make an action on the asset
51
51
  */
52
52
  onAssetAction?: AppContextType['onAssetAction'];
53
- /*
53
+ /**
54
54
  * Callback when the user clicks Connect button
55
55
  * Currently, it is used only for Canva integration
56
56
  * because Canva blocks the CBSDK from opening new tab
57
57
  * without using its predefined method.
58
58
  * https://www.canva.dev/docs/apps/design-guidelines/external-links/#only-open-links-with-requestopenexternalurl
59
- */
59
+ */
60
60
  onConnectClicked?: () => void;
61
+ /**
62
+ * Callback when the token is changed
63
+ */
64
+ onTokenChanged?: (token: string) => void;
61
65
  /**
62
66
  * whether you want to select multiple assets
63
67
  */
@@ -260,6 +264,7 @@ const ContentBrowser: OrangeDAMContentBrowser = {
260
264
  onError,
261
265
  onClose,
262
266
  onRequestToken,
267
+ onTokenChanged,
263
268
  availableRepresentativeSubtypes,
264
269
  allowedExtensions,
265
270
  allowedFolders,
@@ -347,6 +352,10 @@ const ContentBrowser: OrangeDAMContentBrowser = {
347
352
  typeof onImageSelected === 'function' && !!onImageSelected
348
353
  ? onImageSelected
349
354
  : console.log;
355
+ const onTokenChangedHandler =
356
+ typeof onTokenChanged === 'function' && !!onTokenChanged
357
+ ? onTokenChanged
358
+ : undefined;
350
359
  const handleClose = () => {
351
360
  store.dispatch(resetImportStatus());
352
361
  store.dispatch(searchApi.util.resetApiState());
@@ -406,6 +415,8 @@ const ContentBrowser: OrangeDAMContentBrowser = {
406
415
  onImageSelected={imageSelectedHandler}
407
416
  onClose={handleClose}
408
417
  onConnectClicked={onConnectClicked!}
418
+ onTokenChanged={onTokenChangedHandler}
419
+
409
420
  />
410
421
  </GlobalConfigContext.Provider>
411
422
  </Provider>,
@@ -6,6 +6,8 @@ import {
6
6
  FIELD_HAS_BROWSER_CHILDREN,
7
7
  FIELD_IDENTIFIER, FIELD_KEYWORDS, FIELD_MAX_HEIGHT, FIELD_MAX_WIDTH, FIELD_SCRUB_URL, FIELD_SUBTYPE, FIELD_TITLE_WITH_FALLBACK, FIELD_ALLOW_ATS_LINK,
8
8
  FIELD_RECORD_ID,
9
+ FIELD_ORIGINAL_FILE_NAME,
10
+ FIELD_UPDATED_FILE_NAME,
9
11
  } from '@/consts/data';
10
12
  import { Asset, Folder, GetContentRequest, GetContentResponse, GetFavoritesResponse } from '@/types/search';
11
13
  import { AppBaseQuery, GetValueByKeyCaseInsensitive } from '@/utils/api';
@@ -306,6 +308,8 @@ export const searchApi = createApi({
306
308
  ['fields', FIELD_IDENTIFIER],
307
309
  ['fields', FIELD_EXTENSION],
308
310
  ['fields', FIELD_RECORD_ID],
311
+ ['fields', FIELD_ORIGINAL_FILE_NAME],
312
+ ['fields', FIELD_UPDATED_FILE_NAME],
309
313
  ['seeThru', isSeeThrough],
310
314
  ['start', start],
311
315
  ['limit', pageSize],
@@ -352,9 +356,15 @@ export const searchApi = createApi({
352
356
  items:
353
357
  response.contentItems?.map((item) => {
354
358
  let extension = GetValueByKeyCaseInsensitive(item.fields, FIELD_EXTENSION) ?? '';
359
+ let name = GetValueByKeyCaseInsensitive(item.fields, FIELD_UPDATED_FILE_NAME);
355
360
  if (extension && !extension.startsWith('.')) {
356
361
  extension = '.' + extension;
357
362
  }
363
+
364
+ if (isNullOrWhiteSpace(name)) {
365
+ name = GetValueByKeyCaseInsensitive(item.fields, FIELD_ORIGINAL_FILE_NAME);
366
+ }
367
+
358
368
  return {
359
369
  docType: GetValueByKeyCaseInsensitive(item.fields, FIELD_DOC_TYPE) ?? '',
360
370
  docSubType: GetValueByKeyCaseInsensitive(item.fields, FIELD_SUBTYPE) ?? '',
@@ -364,7 +374,7 @@ export const searchApi = createApi({
364
374
  identifier: GetValueByKeyCaseInsensitive(item.fields, FIELD_IDENTIFIER) ?? '',
365
375
  imageUrl: GetValueByKeyCaseInsensitive(item.fields, DEFAULT_VIEW_SIZE) ?? '',
366
376
  originalUrl: GetValueByKeyCaseInsensitive(item.fields, ORIGINAL_VIEW_SIZE) ?? '',
367
- name: GetValueByKeyCaseInsensitive(item.fields, FIELD_TITLE_WITH_FALLBACK) ?? '',
377
+ name: name ?? '',
368
378
  scrubUrl: GetValueByKeyCaseInsensitive(item.fields, FIELD_SCRUB_URL) ?? '',
369
379
  size: GetValueByKeyCaseInsensitive(item.fields, FIELD_FILE_SIZE) ?? '0 MB',
370
380
  tags: GetValueByKeyCaseInsensitive(item.fields, FIELD_KEYWORDS) ?? '',