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.

Sign up for GitHub

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

Jump to bottom

fix(deps): update aws-amplify to v6 (major) #204

Closed
wants to merge 1 commit into from
Closed

fix(deps): update aws-amplify to v6 (major) #204

wants to merge 1 commit into from

Conversation

renovate[bot]
Copy link
Contributor

@renovate renovate bot commented Jan 10, 2024 •
edited
Loading

Mend Renovate

This PR contains the following updates:

Package Change Age Adoption Passing Confidence
@aws-amplify/ui-react (source) ^5.3.3 -> ^6.0.0 age adoption passing confidence
aws-amplify (source) ^5.3.15 -> ^6.0.0 age adoption passing confidence

Release Notes

aws-amplify/amplify-ui (@​aws-amplify/ui-react)

v6.1.0

Compare Source

Minor Changes

v6.0.7

Compare Source

Patch Changes

v6.0.6

Compare Source

Patch Changes

v6.0.5

Compare Source

Patch Changes

v6.0.4

Compare Source

Patch Changes

v6.0.3

Compare Source

Patch Changes

v6.0.2

Compare Source

Patch Changes

v6.0.1

Compare Source

Patch Changes

v6.0.0

Compare Source

Major Changes
  • Authenticator Breaking Changes

The initialState property now accepts forgotPassword in place of resetPassword:

- <Authenticator initialState="resetPassword" />
+ <Authenticator initialState="forgotPassword" />

The user object provided after an end user has been authenticated has been updated to reflect the AuthUser interface available from aws-amplify/auth:

- interface AmplifyUser {
-   challengeName?: ChallengeName;
-   attributes?: CognitpAttributes;
-   username: string;
- }
+ interface AuthUser  {
+   username: string;
+   userId: string;
+   signInDetails?: CognitoAuthSignInDetails;
+ }

AuthUser can be imported from aws-amplify/auth:

import { AuthUser } from 'aws-amplify/auth';

User attributes are now available by directly calling fetchUserAttribues:

import { fetchUserAttributes } from 'aws-amplify/auth';

The function signatures of the services interface have been updated to align with the shape of the underlying aws-amplify/auth APIs used by the Authenticator and provide improved typescript support:

interface AuthenticatorProps {
  services?: {
-    getCurrentUser: () => Promise<any>,
+    getCurrentUser: () => Promise<AuthUser>,

-    handleSignIn: ({ username, password, }: { username: string;password: string; }) => Promise<any>,
+    handleSignIn: (input: SignInInput) => Promise<SignInOutput>,

-    handleSignUp: (formData: any) => Promise<ISignUpResult>,
+    handleSignUp: (input: SignUpInput) => Promise<SignUpOutput>,

-    handleConfirmSignIn: ({ user, code, mfaType, }: { user: any; code: string; mfaType: ChallengeName; }) =>Promise<any>),
+    handleConfirmSignIn: (input: ConfirmSignInInput) => Promise<ConfirmSignInOutput>,

-    handleConfirmSignUp: ({ username, code, }: { username: string; code: string; }) => Promise<any>,
+    handleConfirmSignUp: (input: ConfirmSignUpInput) => Promise<ConfirmSignUpOutput>,

-    handleForgotPasswordSubmit: ({ username, code, password, }: { username: string; code: string; password:string; }) => Promise<string>),
+    handleForgotPasswordSubmit: (input: ConfirmResetPasswordInput) => Promise<void>,

-    handleForgotPassword: (formData: any) => Promise<any>,
+    handleForgotPassword: (input: ResetPasswordInput) => Promise<ResetPasswordOutput>,
  }
}

The input and return type interfaces are available as imports from aws-amplify/auth:

import { ConfirmSignInInput } from 'aws-amplify';

  • #​4452 de87be6d3 Thanks @​dbanksdesign! - BREAKING:

    • Removing stylistic data-attributes from React primitives
    • Update SwitchField classnames to be BEM
    • Removing remnants of "countryCode"

  • #​4509 55d1f4940 Thanks @​dbanksdesign! - breaking: refactoring Tabs component to remove Radix dependency and allow more composability and customization.

    - import { Tabs, TabItem } from '@&#8203;aws-amplify/ui-react'
+ import { Tabs } from '@&#8203;aws-amplify/ui-react'

- <Tabs>
-  <TabItem title="Tab 1">
-    Tab 1 Content
-  </TabItem>

+ <Tabs.Container defaultValue="Tab 1">
+  <Tabs.List>
+    <Tabs.Item value="Tab 1">Tab 1</Tabs.Item>
+  </Tabs.List>
+  <Tabs.Panel value="Tab 1">
+    Tab 1 Content
+  </Tabs.Panel>
+ </Tabs.Container>

    You can also use the Tabs in a uncomposed way too:

    <Tabs
  defaultValue={'Tab 1'}
  items={[
    { label: 'Tab 1', value: 'Tab 1', content: 'Tab content #&#8203;1' },
    { label: 'Tab 2', value: 'Tab 2', content: 'Tab content #&#8203;2' },
    { label: 'Tab 3', value: 'Tab 3', content: 'Tab content #&#8203;3' },
  ]}
/>

    Some notable differences:

    • Instead of providing a defaultIndex or currentIndex you provide a defaultValue or value. Each Tabs.Item and Tabs.Panel should have a value that matches with the corresponding element.
    • onChange becomes onValueChange
    • You should supply a defaultValue or value or else there will be no default selected tab. Previously the Tabs component would default to the first tab.

    There are also more design tokens and better CSS classes for easier customization.

  • #​4474 27783d65a Thanks @​dbanksdesign! - breaking: updating classnames for better BEM syntax

    • amplify-loader__percentage-text -> amplify-loader__label
    • amplify-menu-content-wrapper -> amplify-menu__wrapper
    • amplify-menu-trigger -> amplify-menu__trigger
    • amplify-menu-content -> amplify-menu__content
    • amplify-menu-content__item -> amplify-menu__content__item
    • amplify-pagination__item-button -> amplify-pagination__item
    • amplify-pagination__item-current -> amplify-pagination__item--current
    • amplify-pagination__item-ellipsis -> amplify-pagination__item--ellipsis
    • amplify-rating-icon-container -> amplify-rating__item
    • amplify-rating-icon -> amplify-rating__icon
    • amplify-rating-icon-filled -> amplify-rating__icon--filled
    • amplify-rating-icon-empty -> amplify-rating__icon--empty
    • amplify-select__icon-wrapper -> amplify-select__icon

  • #​4476 59c042c17 Thanks @​dbanksdesign! - breaking: renaming Expander to Accordion and removing Radix dependency. The Accordion component is now built with <details> and <summary> elements to handle showing/hiding content.

    <Accordion.Container>
  <Accordion.Item value="item-1">
    <Accordion.Trigger>
      Click me first!
      <Accordion.Icon />
    </Accordion.Trigger>
    <Accordion.Content>
      Now when you click the second item, this item will automatically
      collapse.
    </Accordion.Content>
  </Accordion.Item>
  <Accordion.Item value="item-2">
    <Accordion.Trigger>
      Then click me!
      <Accordion.Icon />
    </Accordion.Trigger>
    <Accordion.Content>
      Notice how only one item can be open at a time for the single Accordion
      type.
    </Accordion.Content>
  </Accordion.Item>
</Accordion.Container>

    The Accordion can be controlled or uncontrolled (with a default value)

  • Major version bump for all Amplify UI packages due to uprade of peerDependency aws-amplify to v6

  • #​4635 91372387c Thanks @​dbanksdesign! - breaking(theme): removing brand namespace from the theme tokens

    - tokens.colors.brand.primary[10]
+ tokens.colors.primary[10]
    const theme = createTheme({
  tokens: {
    colors: {
-       brand: {
        primary: {
          //...
        }
-       }
    }
  }
})

    We also added the ability to easily set the entire range of primary and secondary colors at the theme level

    const theme = createTheme({
  primaryColor: 'red',
  secondaryColor: 'green',
});
Minor Changes

  • #​4445 7b55f4f78 Thanks @​dbanksdesign! - feat: allow themes to have arbitrary tokens

  • #​4578 27be6ccf5 Thanks @​dbanksdesign! - feat: add CSS layers support and CSS file splitting. The default style import '@​aws-amplify/ui-react/styles.css' remains unchanged so these features are opt-in.
    We are now exposing each different component CSS file if you want fine-grained control over what CSS is loaded. Additionally, we will have a CSS reset and a base CSS file.
    If you only wanted the button CSS you could do this:

    import '@&#8203;aws-amplify/ui-react/styles/reset.css';
import '@&#8203;aws-amplify/ui-react/styles/base.css';
import '@&#8203;aws-amplify/ui-react/styles/button.css';

    You can also use the main 'styles.css' import with the new reset file too.

    To use CSS layers, replace '.css' with '.layer.css' for any CSS import.

    - import '@&#8203;aws-amplify/ui-react/styles.css'
+ import '@&#8203;aws-amplify/ui-react/styles.layer.css'
Patch Changes
aws-amplify/amplify-js (aws-amplify)

v6.0.9: 2023-12-21 Amplify JS release - [email protected]

Compare Source

What's Changed

New Contributors

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.9

v6.0.8

Compare Source

v6.0.7: 2023-12-12 Amplify JS release - [email protected]

Compare Source

What's Changed

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.7

v6.0.6: 2023-12-05 Amplify JS release - [email protected]

Compare Source

What's Changed

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.6

v6.0.5: 2023-11-22 Amplify JS release - [email protected]

Compare Source

What's Changed

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.5

v6.0.4: 2023-11-20 Amplify JS release - [email protected]

Compare Source

What's Changed

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.4

v6.0.3: 2023-11-16 Amplify JS release - [email protected]

Compare Source

What's Changed

Full Changelog: https://github.com/aws-amplify/amplify-js/compare/[email protected]@6.0.3

v6.0.2

Compare Source

v6.0.1

Compare Source

v6.0.0

Compare Source

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about these updates again.

  • If you want to rebase/retry this PR, check this box

This PR has been generated by Mend Renovate. View repository job log here.

@renovate renovate bot enabled auto-merge (squash) January 10, 2024 04:02
@renovate renovate bot force-pushed the renovate/major-aws-amplify branch from 6981f34 to 0ee9bc9 Compare January 10, 2024 04:24
@DerekRoberts
Copy link
Member

DerekRoberts commented Jan 10, 2024 •
edited
Loading 

> tsc && vite build

src/services/AuthService.ts:2:41 - error TS2307: Cannot find module 'amazon-cognito-identity-js' or its corresponding type declarations.

2 import type { CognitoUserSession } from 'amazon-cognito-identity-js'
                                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/store.ts:4:41 - error TS2307: Cannot find module 'amazon-cognito-identity-js' or its corresponding type declarations.

4 import type { CognitoUserSession } from 'amazon-cognito-identity-js'
                                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

@RMCampos
Copy link

This PR will need refactoring. We need to update to this new docs: https://docs.amplify.aws/javascript/build-a-backend/auth/set-up-auth/

@renovate renovate bot force-pushed the renovate/major-aws-amplify branch from 6d64a9d to 1c25be3 Compare January 11, 2024 03:00
@renovate renovate bot force-pushed the renovate/major-aws-amplify branch from 1c25be3 to 8bc2f96 Compare January 11, 2024 03:10
auto-merge was automatically disabled January 11, 2024 03:18

Pull request was closed

@DerekRoberts DerekRoberts deleted the renovate/major-aws-amplify branch January 11, 2024 03:19
@renovate Renovate
Copy link
Contributor Author

renovate bot commented Jan 11, 2024

Renovate Ignore Notification

Because you closed this PR without merging, Renovate will ignore this update. You will not get PRs for any future 6.x releases. But if you manually upgrade to 6.x then Renovate will re-enable minor and patch updates automatically.

If you accidentally closed this PR, or if you changed your mind: rename this PR to get a fresh replacement PR.

@DerekRoberts DerekRoberts mentioned this pull request Jan 11, 2024
Closed
@DerekRoberts DerekRoberts linked an issue Jan 11, 2024 that may be closed by this pull request
fix(deps): update aws-amplify to v6 (major) #214
Closed
@RMCampos RMCampos removed a link to an issue Feb 26, 2024
fix(deps): update aws-amplify to v6 (major) #214
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jazzgrewal jazzgrewal Awaiting requested review from jazzgrewal jazzgrewal is a code owner

@RMCampos RMCampos Awaiting requested review from RMCampos

@DerekRoberts DerekRoberts Awaiting requested review from DerekRoberts DerekRoberts is a code owner

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@DerekRoberts @RMCampos