feat: add error handling page for Storage & Auth

Author: AllanZhengYP

src/directory/directory.mjs

@@ -128,6 +128,9 @@ export const directory = {
                     },
                     {
                       path: 'src/pages/[platform]/build-a-backend/auth/connect-your-frontend/multi-step-sign-in/index.mdx'
+                    },
+                    {
+                      path: 'src/pages/[platform]/build-a-backend/auth/connect-your-frontend/error-handling/index.mdx'
                     }
                   ]
                 },
@@ -390,6 +393,9 @@ export const directory = {
                 },
                 {
                   path: 'src/pages/[platform]/build-a-backend/storage/manage-with-amplify-console/index.mdx'
+                },
+                {
+                  path: 'src/pages/[platform]/build-a-backend/storage/error-handling/index.mdx'
                 }
               ]
             },

src/pages/[platform]/build-a-backend/auth/connect-your-frontend/error-handling/index.mdx

@@ -0,0 +1,66 @@
+import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
+
+export const meta = {
+  title: 'Error handling',
+  description:
+    'Handling errors from Amplify Auth',
+  platforms: [
+    'angular',
+    'javascript',
+    'nextjs',
+    'react',
+    'vue',
+    'react-native'
+  ]
+};
+
+export const getStaticPaths = async () => {
+  return getCustomStaticPath(meta.platforms);
+};
+
+export function getStaticProps(context) {
+  return {
+    props: {
+      platform: context.params.platform,
+      meta
+    }
+  };
+}
+
+The runtime errors thrown by the Amplify Auth APIs may contains additional information to help root-causing the problems. These information are available if the error is an instance of `AuthError`.
+
+```javascript
+import { AuthError, confirmSignUp } from 'aws-amplify/auth';
+
+try {
+  const result = await confirmSignUp({
+    username: "[email protected]",
+    confirmationCode: "123456"
+  });
+} catch (error) {
+  if (error instanceof AuthError) {
+    console.error('Auth error', error.name);
+    if (error.metadata) {
+      console.error('request ID: ', error.metadata.requestId);
+    }
+  } 
+  // Further error handling...
+}
+```
+
+`AuthError` may also be thrown by the Storage APIs.
+
+## All `AuthError` properties
+
+Property | Type | Required | Description |
+| -- | -- | -- | ----------- |
+| name | String | Required | Client-side error name or server-side error code. |
+| message | String | Required | Error message. |
+| stack | String | Optional | Stack trace. |
+| recoverySuggestion | String | Optional | Common cause of the error and human-readable recommendation to fix the error.|
+| metadata | Object | Optional | Bag of additional error information. |
+| metadata.httpStatusCode | number | Optional | The response HTTP status code if the error is caused by erroneous HTTP response. |
+| metadata.requestId | String | Optional | The request ID useful to contact AWS Support. |
+| metadata.extendedRequestId | String | Optional | The request ID useful to contact AWS Support. |
+
+

src/pages/[platform]/build-a-backend/storage/error-handling/index.mdx

@@ -0,0 +1,67 @@
+import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
+
+export const meta = {
+  title: 'Error handling',
+  description:
+    'Handling errors from Amplify Storage',
+  platforms: [
+    'angular',
+    'javascript',
+    'nextjs',
+    'react',
+    'vue',
+    'react-native'
+  ]
+};
+
+export const getStaticPaths = async () => {
+  return getCustomStaticPath(meta.platforms);
+};
+
+export function getStaticProps(context) {
+  return {
+    props: {
+      platform: context.params.platform,
+      meta
+    }
+  };
+}
+
+The runtime errors thrown by the Amplify Storage APIs may contains additional information to help root-causing the problems. These information are available if the error is an instance of `StorageError`.
+
+```javascript
+import { StorageError, uploadData } from 'aws-amplify/storage';
+
+try {
+  const result = await uploadData({
+    path: "album/2024/1.jpg",
+    data: file,
+  }).result;
+  console.log('Succeeded: ', result);
+} catch (error) {
+  if (error instanceof StorageError) {
+    console.error('Storage error', error.name);
+    if (error.metadata) {
+      console.error('request ID: ', error.metadata.requestId);
+    }
+  } 
+  // Further error handling...
+}
+```
+
+`AuthError` may also be thrown by the Storage APIs.
+
+## All `StorageError` properties
+
+Property | Type | Required | Description |
+| -- | -- | -- | ----------- |
+| name | String | Required | Client-side error name or server-side error code. |
+| message | String | Required | Error message. |
+| stack | String | Optional | Stack trace. |
+| recoverySuggestion | String | Optional | Common cause of the error and human-readable recommendation to fix the error.|
+| metadata | Object | Optional | Bag of additional error information. |
+| metadata.httpStatusCode | number | Optional | The response HTTP status code if the error is caused by erroneous HTTP response. |
+| metadata.requestId | String | Optional | The request ID useful to [contact AWS Support](https://docs.aws.amazon.com/AmazonS3/latest/API/get-request-ids.html). |
+| metadata.extendedRequestId | String | Optional | The request ID useful to [contact AWS Support](https://docs.aws.amazon.com/AmazonS3/latest/API/get-request-ids.html). |
+
+