From 8afffc28d0e1a5e9b201ed043a63880af0621bf9 Mon Sep 17 00:00:00 2001 From: huayunh Date: Tue, 3 Oct 2023 13:08:16 -0400 Subject: [PATCH] Update dates and version number --- login-workflow/CHANGELOG.md | 5 +-- login-workflow/LICENSES.json | 2 +- login-workflow/README.md | 14 +++++--- login-workflow/docs/migration-guide-3-4.md | 37 ++++++++-------------- login-workflow/package.json | 2 +- 5 files changed, 28 insertions(+), 32 deletions(-) diff --git a/login-workflow/CHANGELOG.md b/login-workflow/CHANGELOG.md index 9516f848..e94a25ab 100644 --- a/login-workflow/CHANGELOG.md +++ b/login-workflow/CHANGELOG.md @@ -5,14 +5,15 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). -## v5.0.0 (October 3, 2023) +## v4.0.0 (October 4, 2023) ### Added - Reusable screen components. - Support for custom react auth workflow injection. - Support for router customizability. -- Learn more about migrating from v4 => v5 your existing application by reading our [Migrating Guide](https://github.com/etn-ccis/blui-react-workflows/blob/master/login-workflow/README.md#migrating-from-v4--v5). + +Learn more about migrating from v3 => v4 your existing application by reading our [Migrating Guide](https://github.com/etn-ccis/blui-react-workflows/blob/master/login-workflow/README.md#migrating-from-v3--v4). ### Changed diff --git a/login-workflow/LICENSES.json b/login-workflow/LICENSES.json index 43abc85f..56a74816 100644 --- a/login-workflow/LICENSES.json +++ b/login-workflow/LICENSES.json @@ -47,7 +47,7 @@ "licenseUrl": "https://github.com/facebook/create-react-app/raw/master/LICENSE", "parents": "example" }, - "react-i18next@13.0.2": { + "react-i18next@13.0.3": { "licenses": "MIT", "repository": "https://github.com/i18next/react-i18next", "licenseUrl": "https://github.com/i18next/react-i18next/raw/master/LICENSE", diff --git a/login-workflow/README.md b/login-workflow/README.md index 4291656c..75ceb737 100644 --- a/login-workflow/README.md +++ b/login-workflow/README.md @@ -5,6 +5,7 @@ The React Auth Workflow package provides a consistent UI implementation of authentication-related capabilities for use in Eaton web applications built with React. The package is intended to provide a standard, out-of-the-box experience for capabilities such as: + - Login - Forgot / Reset Password - Change Password @@ -16,7 +17,6 @@ This package is flexible, allowing you to use the Login and Registration flows i These workflows are back-end agnostic, meaning you can use them with any back-end API you wish. You simply need to provide an implementation for several key functions (actions) that are called at various points within the workflows based on user interaction. - ![Login](https://raw.githubusercontent.com/etn-ccis/blui-react-workflows/master/login-workflow/media/login.png) ![Password](https://raw.githubusercontent.com/etn-ccis/blui-react-workflows/master/login-workflow/media/password.png) @@ -31,6 +31,7 @@ yarn add @brightlayer-ui/react-auth-workflow ``` ### Peer Dependencies + This package also has a number of peer dependency requirements that you will need to install in your project. To install the latest version of all of these peer dependencies, run the following command in your project root: ``` @@ -44,6 +45,7 @@ yarn add @mui/material @emotion/react @emotion/styled @mui/icons-material @brigh To use the package, read our [Integration](https://github.com/etn-ccis/blui-react-workflows/tree/master/login-workflow/docs/integration.md) instructions. Even if you are starting from scratch, it may be useful for you to refer to the [Example](https://github.com/etn-ccis/blui-react-workflows/tree/master/login-workflow/example) project while getting started. In short, you will need to: + - Add routes for each of the Login Workflow screens you wish to include - Define a mechanism for tracking the authenticated state of the current user - Add a registration route for the registration workflow component @@ -63,10 +65,12 @@ In short, you will need to: - [Components & APIs](https://github.com/etn-ccis/blui-react-workflows/tree/master/login-workflow/docs/components/README.md) - [Screens](https://github.com/etn-ccis/blui-react-workflows/tree/master/login-workflow/docs/screens/README.md) -# Migrating from v4 => v5 -We have listened to your feedback and version 5 of this library is a significant rewrite that aims to address many requests for greater flexibility and customization of the workflows. +# Migrating from v3 => v4 + +We have listened to your feedback and version 4 of this library is a significant rewrite that aims to address many requests for greater flexibility and customization of the workflows. Some notable changes include: + - Router independence — you now have full control over your routing library and its configuration - Allowing you to manage the authentication status / mechanism (separating UI from business logic) - Separation of Login and Registration workflows so they can be used independently @@ -74,7 +78,7 @@ Some notable changes include: - Exporting screens individually so you can build your own custom flows - Simpler approach to translations (separating our internal translations from your application-level translations) - Greater customization of screens through props (and moving customization properties to the screens they affect instead of handling all customizations through a monolithic wrapper component) -- Improved error management mechanism (customizable) +- Improved error management mechanism (customizable) Learn more about upgrading your existing application by reading our [Migrating Guide](https://github.com/etn-ccis/blui-react-workflows/tree/master/login-workflow/docs/migration-guide-4-5.md) @@ -119,4 +123,4 @@ yarn generate:licenses ## Browser Support -Brightlayer UI Login Workflow will work with any modern browser. For details refer to our [Browser Support](https://brightlayer-ui.github.io/development/frameworks-web/react#browser-support) documentation. \ No newline at end of file +Brightlayer UI Login Workflow will work with any modern browser. For details refer to our [Browser Support](https://brightlayer-ui.github.io/development/frameworks-web/react#browser-support) documentation. diff --git a/login-workflow/docs/migration-guide-3-4.md b/login-workflow/docs/migration-guide-3-4.md index 0d097917..5b84486e 100644 --- a/login-workflow/docs/migration-guide-3-4.md +++ b/login-workflow/docs/migration-guide-3-4.md @@ -1,55 +1,52 @@ -# Migration Guide: v4.x => v5.x +# Migration Guide: v3.x => v4.x ## Update Dependencies First, update your @brightlayer-ui/react-auth-workflow dependency to the latest version. + ```shell -npm install --save @brightlayer-ui/react-auth-workflow@^5.0.0 +npm install --save @brightlayer-ui/react-auth-workflow@^4.0.0 // or -yarn upgrade @brightlayer-ui/react-auth-workflow@^5.0.0 +yarn upgrade @brightlayer-ui/react-auth-workflow@^4.0.0 ``` ## Managing Auth State In order to be more flexible / customizable, the workflow no longer manages the authentication status of the user internally. You will need to establish your own mechanism (such as using a ContextProvider or Redux) to track whether or not a user is authenticated to your application. For reference, you can look at how we set up the [AppContext](https://github.com/etn-ccis/blui-react-workflows/blob/master/login-workflow/example/src/contexts/AppContextProvider.tsx) in the example project. - ## Managing Routing In order to be more flexible / customizable, the workflow no longer manages routing. The `AuthNavigationContainer` has been removed and will need to be replaced by your own routing solution (we recommend React Router). Please follow our [Routing Guide](./routing.md) for detailed information on setup. - ## Managing Workflow Providers -We previously provided a `AuthUIContextProvider` component that was used to configure / wrap both the Authentication workflow and the Registration workflow. In version 5, we have split the management of the workflows so that they can be used independently. You will need to implement the [`AuthContextProvider`](authentication-workflow.md) and [`RegistrationContextProvider`](./registration-workflow.md) instead. +We previously provided a `AuthUIContextProvider` component that was used to configure / wrap both the Authentication workflow and the Registration workflow. In version 4, we have split the management of the workflows so that they can be used independently. You will need to implement the [`AuthContextProvider`](authentication-workflow.md) and [`RegistrationContextProvider`](./registration-workflow.md) instead. ## Managing Translations / Internationalization You no longer need to merge your apps translation data into the workflow — they an exist independently for the sake of simplifying your setup. If you aren't already, you will need to set up [react-i18next](https://react.i18next.com/) to manage your application side translations. Refer to our [Language Support](./language-support.md) guide for more information. - ## Updated Actions ### AuthUIActions The `SecurityContextActions` no longer exist in the newest version and so they will not be available to your action definitions (i.e., `onUserAuthenticated` and `onUserNotAuthenticated` are no longer available). You will need to pass your own self-managed auth state/functions and use those instead (refer to above). - ## RegistrationUIActions -1) Update type name `AccountDetailInformation` to `AccountDetails`. +1. Update type name `AccountDetailInformation` to `AccountDetails`. ```tsx -// before +// before import { RegistrationUIActions, AccountDetailInformation } from '@brightlayer-ui/react-auth-workflow'; // after import { RegistrationUIActions, AccountDetails } from '@brightlayer-ui/react-auth-workflow'; ``` -2) LoadEULA renamed to loadEula +2. LoadEULA renamed to loadEula ```tsx -// before +// before loadEULA: async (language: string): Promise => { ... return SAMPLE_EULA; @@ -62,7 +59,7 @@ loadEula: async (language: string): Promise => { }, ``` -3) Additional data available in completeRegistration +3. Additional data available in completeRegistration The `userData` parameter will now pass all data collected from the registration workflow, including custom data. @@ -91,19 +88,17 @@ completeRegistration: async ( }, ``` -4) New actions available +4. New actions available To give greater flexibility / granularity in the workflow, we have added a few more actions in registrationUIActions such as `acceptEula`, `requestRegistrationCode`, `createPassword`, and `setAccountDetails`. Refer to the [Registration Workflow](./registration-workflow.md) Guide for information about these new actions. - ## New Setup Your new app architecture will look something like this once you have made all of the necessary updates: - ```tsx // Your application instance of i18n - + {/* Your custom context provider for managing auth state, etc. */} {/* Your implementation of a routing solution */} - - {/* Auth Routes */} - - - {/* Registration Routes */} - + {/* Auth Routes */} + {/* Registration Routes */} diff --git a/login-workflow/package.json b/login-workflow/package.json index bc689ebb..2d4d2d31 100644 --- a/login-workflow/package.json +++ b/login-workflow/package.json @@ -1,6 +1,6 @@ { "name": "@brightlayer-ui/react-auth-workflow", - "version": "5.0.0", + "version": "4.0.0", "author": "Brightlayer UI (https://github.com/brightlayer-ui)", "license": "BSD-3-Clause", "description": "Re-usable workflow components for Authentication and Registration within Eaton applications.",