From 59a42c76c5a5ac6a91cf2086fb21e45caebc80d5 Mon Sep 17 00:00:00 2001 From: Gao Sun Date: Thu, 17 Aug 2023 09:35:55 +0800 Subject: [PATCH] refactor(console): align further readings section (#4349) --- .../guides/native-android-java/README.mdx | 12 ----- .../docs/guides/native-android-kt/README.mdx | 12 ----- .../docs/guides/native-ios-swift/README.mdx | 12 ----- .../assets/docs/guides/spa-react/README.mdx | 12 ----- .../assets/docs/guides/spa-vanilla/README.mdx | 12 ----- .../src/assets/docs/guides/spa-vue/README.mdx | 12 ----- .../assets/docs/guides/web-express/README.mdx | 12 ----- .../src/assets/docs/guides/web-go/README.mdx | 12 ----- .../assets/docs/guides/web-next/README.mdx | 12 ----- .../src/mdx-components-v2/Step/index.tsx | 4 +- .../Steps/FurtherReadings.tsx | 48 +++++++++++++++++++ .../src/mdx-components-v2/Steps/index.tsx | 14 ++++-- 12 files changed, 61 insertions(+), 113 deletions(-) create mode 100644 packages/console/src/mdx-components-v2/Steps/FurtherReadings.tsx diff --git a/packages/console/src/assets/docs/guides/native-android-java/README.mdx b/packages/console/src/assets/docs/guides/native-android-java/README.mdx index 4fb4c8646..506a40e30 100644 --- a/packages/console/src/assets/docs/guides/native-android-java/README.mdx +++ b/packages/console/src/assets/docs/guides/native-android-java/README.mdx @@ -106,16 +106,4 @@ logtoClient.signOut(logtoException -> { - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/native-android-kt/README.mdx b/packages/console/src/assets/docs/guides/native-android-kt/README.mdx index 23d667d36..051a036a9 100644 --- a/packages/console/src/assets/docs/guides/native-android-kt/README.mdx +++ b/packages/console/src/assets/docs/guides/native-android-kt/README.mdx @@ -98,16 +98,4 @@ logtoClient.signOut { logtoException: LogtoException? -> - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx b/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx index f304021df..a46513fb0 100644 --- a/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx +++ b/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx @@ -119,16 +119,4 @@ await client.signOut() - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/spa-react/README.mdx b/packages/console/src/assets/docs/guides/spa-react/README.mdx index d25455956..b35e61bfc 100644 --- a/packages/console/src/assets/docs/guides/spa-react/README.mdx +++ b/packages/console/src/assets/docs/guides/spa-react/README.mdx @@ -164,16 +164,4 @@ After signing out, it'll be great to redirect user back to your website. Let's a - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/spa-vanilla/README.mdx b/packages/console/src/assets/docs/guides/spa-vanilla/README.mdx index d879a2f71..6c69599e8 100644 --- a/packages/console/src/assets/docs/guides/spa-vanilla/README.mdx +++ b/packages/console/src/assets/docs/guides/spa-vanilla/README.mdx @@ -134,16 +134,4 @@ After signing out, it'll be great to redirect user back to your website. Let's a - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/spa-vue/README.mdx b/packages/console/src/assets/docs/guides/spa-vue/README.mdx index e1e0641b1..cab94a588 100644 --- a/packages/console/src/assets/docs/guides/spa-vue/README.mdx +++ b/packages/console/src/assets/docs/guides/spa-vue/README.mdx @@ -183,16 +183,4 @@ After signing out, it'll be great to redirect user back to your website. Let's a - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/web-express/README.mdx b/packages/console/src/assets/docs/guides/web-express/README.mdx index 7f9efbd04..467c7cad0 100644 --- a/packages/console/src/assets/docs/guides/web-express/README.mdx +++ b/packages/console/src/assets/docs/guides/web-express/README.mdx @@ -186,16 +186,4 @@ After signing out, it'll be great to redirect your user back to your website. Le - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/web-go/README.mdx b/packages/console/src/assets/docs/guides/web-go/README.mdx index a465e2532..520063e52 100644 --- a/packages/console/src/assets/docs/guides/web-go/README.mdx +++ b/packages/console/src/assets/docs/guides/web-go/README.mdx @@ -351,16 +351,4 @@ After the user makes a signing-out request, Logto will clear all user authentica - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/assets/docs/guides/web-next/README.mdx b/packages/console/src/assets/docs/guides/web-next/README.mdx index 6a8fb25c1..4fe94ff22 100644 --- a/packages/console/src/assets/docs/guides/web-next/README.mdx +++ b/packages/console/src/assets/docs/guides/web-next/README.mdx @@ -233,16 +233,4 @@ After signing out, it'll be great to redirect user back to your website. Let's a - - -- [Customize sign-in experience](https://docs.logto.io/docs/tutorials/get-started/customize-sign-in-experience) -- [Enable SMS or email passcode sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-sms-or-email-passwordless-sign-in) -- [Enable social sign-in](https://docs.logto.io/docs/tutorials/get-started/passwordless-sign-in-by-adding-connectors#enable-social-sign-in) -- [Protect your API](https://docs.logto.io/docs/recipes/protect-your-api) - - - diff --git a/packages/console/src/mdx-components-v2/Step/index.tsx b/packages/console/src/mdx-components-v2/Step/index.tsx index 9d63d0b10..9f13d6b0c 100644 --- a/packages/console/src/mdx-components-v2/Step/index.tsx +++ b/packages/console/src/mdx-components-v2/Step/index.tsx @@ -7,7 +7,7 @@ import DangerousRaw from '@/ds-components/DangerousRaw'; import * as styles from './index.module.scss'; export type Props = { - index: number; + index?: number; title: string; subtitle?: string; children: ReactNode; @@ -17,7 +17,7 @@ function Step({ title, subtitle, index, children }: Props, ref?: Ref
- + {title}} diff --git a/packages/console/src/mdx-components-v2/Steps/FurtherReadings.tsx b/packages/console/src/mdx-components-v2/Steps/FurtherReadings.tsx new file mode 100644 index 000000000..bf64a1177 --- /dev/null +++ b/packages/console/src/mdx-components-v2/Steps/FurtherReadings.tsx @@ -0,0 +1,48 @@ +import TextLink from '@/ds-components/TextLink'; + +import Step, { type Props } from '../Step'; + +export default function FurtherReadings(props: Omit) { + return ( + +
    +
  • + + Customize sign-in experience + +
    • +
  • + + Enable SMS or email passwordless sign-in + +
    • +
  • + + Enable social sign-in + +
    • +
  • + + Protect your API + +
    • +
+ + ); +} diff --git a/packages/console/src/mdx-components-v2/Steps/index.tsx b/packages/console/src/mdx-components-v2/Steps/index.tsx index 9d72e89b7..bde701bb7 100644 --- a/packages/console/src/mdx-components-v2/Steps/index.tsx +++ b/packages/console/src/mdx-components-v2/Steps/index.tsx @@ -8,6 +8,7 @@ import Sample from '../Sample'; import { type Props as StepProps } from '../Step'; import type Step from '../Step'; +import FurtherReadings from './FurtherReadings'; import * as styles from './index.module.scss'; type Props = { @@ -34,9 +35,16 @@ export default function Steps({ children: reactChildren }: Props) { const stepReferences = useRef>>([]); const { scrollTop } = useScroll(findScrollableElement(contentRef.current)); const [activeIndex, setActiveIndex] = useState(-1); - const children = useMemo( - () => (Array.isArray(reactChildren) ? reactChildren : [reactChildren]), - [reactChildren] + const furtherReadings = useMemo( + () => , + [] + ); + const children: Array> = useMemo( + () => + Array.isArray(reactChildren) + ? reactChildren.concat(furtherReadings) + : [reactChildren, furtherReadings], + [furtherReadings, reactChildren] ); useEffect(() => {