Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Migration guide #173

Closed
wants to merge 19 commits into from
Closed

Migration guide #173

wants to merge 19 commits into from

Conversation

nimithajalal
Copy link
Collaborator

Description

Related Issue

Motivation and Context

How Has This Been Tested?

Screenshots (if appropriate):

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • I have signed the Adobe Open Source CLA.
  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.

@nimithajalal nimithajalal requested a review from undavide October 4, 2024 08:56
Copy link
Collaborator

@undavide undavide left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That is some amazing work!! Partners are going to love it, whether it gets published before or after Thursday :-)
I've added just a few comments for improved legibility.

src/pages/guides/concepts/migration.md Outdated Show resolved Hide resolved
Comment on lines 77 to 81
### Workflow API example

**V3**: `Editor create API: ccEverywhere.createDesign(inputParams);`

**V4**: `Editor create API: ccEverywhere.editor.create(docConfig, appConfig, exportConfig, containerConfig);`
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To avoid repetition of "Editor create API" and move it out of the monospace, an alternative could be:

Editor Workflow API example

V3: ccEverywhere.createDesign(inputParams);

V4: ccEverywhere.editor.create(docConfig, appConfig, exportConfig, containerConfig);

Comment on lines 92 to 94
* Desired asset data type for images.
* For image output types, host can set this property to either base64 or url. The default type for images is base64.
* For videos, we will always send the output as a URL irrespective of this property.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know it's a small thing, but I was once asked to carriage return the comments so the resulting code block doesn't have a horizontal scroll-bar and everything's visible, so:

 * Desired asset data type for images.
 * For image output types, host can set this property to either base64 
 * or url. The default type for images is base64. 
 * For videos,  we will always send the output as a URL irrespective 
 * of this property.

You can copy and paste the above for convenience

Comment on lines 102 to 124
``` ts
{
/** Id of element to which iframe must be appended. By default, it is appended to the body.*/
parentElementId?: string;
/** Maximum size boundary of the iframe.*/
size?: PixelSize;
/** Minimum size boundary of the iframe.*/
minSize?: PixelSize;
/** Padding applied to the iframe in pixels.*/
padding?: number;
/** Border Radius applied to the iframe in pixels. */
borderRadius?: number;
/** Override the background color of the iframe. By default this is as per theme. */
backgroundColor?: string;
/** Show spinner while loading target app. Default is true. */
showLoader?: boolean;
/**
* If target app doesn't open within this time (in ms, same as of setTimeout),
* the error callback is invoked with error code TARGET_LOAD_TIMED_OUT.
*/
loadTimeout?: number;
}
```
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

{
  /** Id of element to which iframe must be appended. 
   * By default, it is appended to the body. */
  parentElementId?: string;
  /** Maximum size boundary of the iframe.*/
  size?: PixelSize;
  /** Minimum size boundary of the iframe.*/
  minSize?: PixelSize;
  /** Padding applied to the iframe in pixels.*/
  padding?: number;
  /** Border Radius applied to the iframe in pixels. */
  borderRadius?: number;
  /** Override the background color of the iframe. 
   * By default this is as per theme. */
  backgroundColor?: string;
  /** Show spinner while loading target app. Default is true. */
  showLoader?: boolean;
  /**
   * If the target app doesn't open within this time (in ms, same as 
   * setTimeout), the error callback is invoked with the error code
   * TARGET_LOAD_TIMED_OUT.
   */
  loadTimeout?: number;
}

Comment on lines 149 to 171
```ts
{
exportOptions?: ExportOptionsEditor[];
/**
* Decides whether the multiple pages can be exported
* @default true
*/
multiPage?: boolean;
/**
* Specify the list of file types that the user can download.
* This can be used to limit the download options as per file types for end users.
* This limitation is applied to both native download and custom download scenarios.
*/
allowedFileTypes?: FileType[];
/**
* Value between 0 and 1 to control the quality of the image.
* Currently, only supported for ImageFileType.JPEG when exporting.
* @minimum 0
* @maximum 1
*/
imageQuality?: number;
}
```
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

{
  exportOptions?: ExportOptionsEditor[];
  /**
 * Decides whether the multiple pages can be exported
 * @default true
 */
  multiPage?: boolean;
  /**
   * Specify the list of file types that the user can download.
   * This can be used to limit the download options for end users 
   * based on file types. This limitation is applied to both native 
   * download and custom download scenarios.
   */
  allowedFileTypes?: FileType[];
  /**
 * Value between 0 and 1 to control the quality of the image.
 * Currently, only supported for ImageFileType.JPEG when exporting.
 * @minimum 0
 * @maximum 1
 */
  imageQuality?: number;
}

Comment on lines 231 to 242
```ts
{
/** Export options to be displayed in Image Module. */
exportOptions?: ExportOptionsEditor[];
/**
* Specify the list of file types that the user can download.
* This can be used to limit the download options as per file types for end users.
* This limitation is applied to both native download and custom download scenarios.
*/
allowedFileTypes?: FileType[];
}
```
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

{
  /** Export options to be displayed in Image Module. */
  exportOptions?: ExportOptionsEditor[];
  /**
   * Specify the list of file types that the user can download.
   * This can be used to limit the download options for end users 
   * based on file types. This limitation is applied to both native 
   * download and custom download scenarios.
   */
  allowedFileTypes?: FileType[];
}

Comment on lines 273 to 275
- `QuickActionDocParams`: This contains the common inputs for all QA.
- `<Image / Video>QuickActionDocParams extends QuickActionDocParams`: This contains the inputs relevant for a particular QA type (Image/Video/PDF).
- `<API-Specific>QuickActionParams extends Image/VideQuickActionParams`: inputs specific for a particular API.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The rendition is weird, but I suggest not losing any sleep over this, it's just Gatsby being Gatsby and AIO-Theme being AIO-Theme
image

Comment on lines 280 to 289
```ts
{
/** Theming options for the Quick Action Editor */
colorTheme?: ColorTheme;
spectrumTheme?: SpectrumTheme;
scale?: Scale;
/** Boolean that tells whether to receive target application errors or not to client. */
receiveTargetErrors?: boolean;
}
```
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

{
  /** Theming options for the Quick Action Editor */
  colorTheme?: ColorTheme;
  spectrumTheme?: SpectrumTheme;
  scale?: Scale;
  /** Boolean that tells whether to receive target application 
   * errors or not to client. */
  receiveTargetErrors?: boolean;
}


### 1. Update SDK Version

Use this link to get the latest version -- [https://cc-embed.adobe.com/docs/v4/release/3p/modules.html](https://cc-embed.adobe.com/docs/v4/release/3p/modules.html)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We'll hot-fix this if/when it changes after the new SDK generation

gatsby-config.js Outdated
path: "/guides/concepts/migration.md",
pages: [
{
title: "Migration Guide: Adobe Express Embed SDK V3 to V4",
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was wondering whether to use a shorter title (just in the navbar) that fits a single row, like "Migration Guide: V3 to V4," leaving the full title on the page.

image

@undavide
Copy link
Collaborator

undavide commented Oct 7, 2024

@nimithajalal I see that GitHub is complaining:
image
Maybe try to merge main on it and cross fingers, knock on wood etc. ;-)

@nimithajalal
Copy link
Collaborator Author

I am closing this PR, as this already went live.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants