refactor: Move API Docs under References

redirects.json

@@ -10226,6 +10226,156 @@
 		"source": "/vue/start/connect-existing-aws-resources",
 		"target": "/vue/start/connect-to-aws-resources",
 		"status": "301"
+	},
+	{
+		"source": "/angular/build-a-backend/auth/reference",
+		"target": "/angular/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/angular/build-a-backend/storage/reference",
+		"target": "/angular/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/angular/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/angular/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/angular/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/angular/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/angular/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/angular/reference/api/aws-amplify/api",
+		"status": "301"
+	},
+	{
+		"source": "/javascript/build-a-backend/auth/reference",
+		"target": "/javascript/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/javascript/build-a-backend/storage/reference",
+		"target": "/javascript/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/javascript/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/javascript/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/javascript/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/javascript/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/javascript/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/javascript/reference/api/aws-amplify/api",
+		"status": "301"
+	},
+	{
+		"source": "/nextjs/build-a-backend/auth/reference",
+		"target": "/nextjs/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/nextjs/build-a-backend/storage/reference",
+		"target": "/nextjs/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/nextjs/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/nextjs/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/nextjs/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/nextjs/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/nextjs/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/nextjs/reference/api/aws-amplify/api",
+		"status": "301"
+	},
+	{
+		"source": "/react/build-a-backend/auth/reference",
+		"target": "/react/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/react/build-a-backend/storage/reference",
+		"target": "/react/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/react/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/react/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/react/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/react/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/react/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/react/reference/api/aws-amplify/api",
+		"status": "301"
+	},
+	{
+		"source": "/react-native/build-a-backend/auth/reference",
+		"target": "/react-native/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/react-native/build-a-backend/storage/reference",
+		"target": "/react-native/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/react-native/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/react-native/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/react-native/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/react-native/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/react-native/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/react-native/reference/api/aws-amplify/api",
+		"status": "301"
+	},
+	{
+		"source": "/vue/build-a-backend/auth/reference",
+		"target": "/vue/reference/api/aws-amplify/auth",
+		"status": "301"
+	},
+	{
+		"source": "/vue/build-a-backend/storage/reference",
+		"target": "/vue/reference/api/aws-amplify/storage",
+		"status": "301"
+	},
+	{
+		"source": "/vue/build-a-backend/add-aws-services/analytics/reference",
+		"target": "/vue/reference/api/aws-amplify/analytics",
+		"status": "301"
+	},
+	{
+		"source": "/vue/build-a-backend/add-aws-services/in-app-messaging/reference",
+		"target": "/vue/reference/api/aws-amplify/in-app-messaging",
+		"status": "301"
+	},
+	{
+		"source": "/vue/build-a-backend/add-aws-services/rest-api/reference",
+		"target": "/vue/reference/api/aws-amplify/api",
+		"status": "301"
 	}
 ]
 

src/components/ApiDocs/ReferencePage.tsx

@@ -2,14 +2,15 @@ import { Fragment } from 'react';
 
 import { FunctionReference } from './FunctionReference';
 import { Divider, View, Flex } from '@aws-amplify/ui-react';
-import { API_CATEGORIES, API_SUB_CATEGORIES } from '@/data/api-categories.mjs';
+import { REFERENCE_IMPORTS_LOOKUP } from '@/data/api-categories.mjs';
 import references from '@/directory/apiReferences/amplify-js.json';
 import { MDXHeading } from '../MDXComponents';
 
-export const ReferencePage = ({ category }) => {
-  category = API_CATEGORIES[category] || API_SUB_CATEGORIES[category];
+export const ReferencePage = ({ importName }) => {
+  const importConfig = REFERENCE_IMPORTS_LOOKUP[importName];
+
   const cat = references['categories'].find(
-    (catObject) => catObject.name === category
+    (catObject) => catObject.name === importConfig.category
   );
   return (
     <View className={'reference-page'}>

src/data/api-categories.mjs

@@ -1,13 +1,29 @@
 // mapping of api categories coming in from libraries to the associated categories in the docs
-export const API_CATEGORIES = {
-  auth: 'auth',
-  storage: 'storage'
-};
 
-export const API_SUB_CATEGORIES = {
-  analytics: 'analytics',
-  'rest-api': 'api',
-  'in-app-messaging': 'in-app-messaging'
+export const REFERENCE_IMPORTS = {
+  'amplify-js': [
+    ['aws-amplify', 'auth'],
+    ['aws-amplify', 'storage'],
+    ['aws-amplify', 'analytics'],
+    ['aws-amplify', 'api'],
+    ['aws-amplify', 'in-app-messaging']
+  ]
 };
 
+// Mapping to make reference page building direct
+// { 'aws-amplify/auth': {repo: 'amplify-js', category: 'auth'}}
+export const REFERENCE_IMPORTS_LOOKUP = Object.keys(REFERENCE_IMPORTS)
+  .flatMap((repo) => {
+    return REFERENCE_IMPORTS[repo].map((importName) => {
+      const importPath = importName.join('/');
+      const retObj = {};
+      retObj[importPath] = {
+        repo,
+        category: importName[importName.length - 1]
+      };
+      return retObj;
+    });
+  })
+  .reduce((retObj, curObj) => ({ ...retObj, ...curObj }), {});
+
 export const ROOT_PACKAGE = 'aws-amplify';

src/directory/directory.mjs

@@ -1009,6 +1009,10 @@ export const directory = {
         {
           path: 'src/pages/[platform]/reference/index.mdx',
           children: [
+            {
+              path: 'src/pages/[platform]/reference/api/index.mdx',
+              children: []
+            },
             {
               path: 'src/pages/[platform]/reference/project-structure/index.mdx'
             },

src/directory/generateDirectory.mjs

@@ -6,7 +6,7 @@ import JSON5 from 'json5';
 import { directory } from './directory.mjs';
 import { writeFile } from 'fs/promises';
 import { getLastModifiedDate } from 'git-jiggy';
-import { API_CATEGORIES, API_SUB_CATEGORIES } from '../data/api-categories.mjs';
+import { REFERENCE_IMPORTS_LOOKUP } from '../data/api-categories.mjs';
 
 // Set up the root path so that we can get the correct path from the current working directory
 const rootPath = path.resolve(cwd(), 'src/pages');
@@ -147,31 +147,19 @@ async function generateDirectory() {
     'react-native',
     'vue'
   ];
-  const categoryKeys = Object.keys(API_CATEGORIES);
-  categoryKeys.forEach((cat) => {
-    const name = API_CATEGORIES[cat];
-    const route = `/[platform]/build-a-backend/${cat}`;
-    const catNode = findDirectoryNode(route, directoryCopy);
-    if (catNode) {
-      catNode.children.push({
-        title: `API References`,
-        description: `API References - ${name}`,
-        platforms: JS_PLATFORMS,
-        route: `${route}/reference`
-      });
-    }
-  });
-
-  Object.keys(API_SUB_CATEGORIES).forEach((cat) => {
-    const name = API_SUB_CATEGORIES[cat];
-    const route = `/[platform]/build-a-backend/add-aws-services/${cat}`;
-    const catNode = findDirectoryNode(route, directoryCopy);
+  const apiReferenceKeys = Object.keys(REFERENCE_IMPORTS_LOOKUP);
+  apiReferenceKeys.forEach((cat) => {
+    const route = `/[platform]/reference/api/${cat}`;
+    const catNode = findDirectoryNode(
+      '/[platform]/reference/api',
+      directoryCopy
+    );
     if (catNode) {
       catNode.children.push({
-        title: `API References`,
-        description: `API References - ${name}`,
+        title: cat,
+        description: `API References for ${cat}`,
         platforms: JS_PLATFORMS,
-        route: `${route}/reference`
+        route: route
       });
     }
   });

src/pages/[platform]/build-a-backend/[category]/reference/index.mdx → src/pages/[platform]/reference/api/[...importName]/index.mdx

@@ -1,7 +1,6 @@
 import { getApiStaticPath } from '@/utils/getApiStaticPath';
 
 export const meta = {
-  title: 'API Reference',
   description: 'API Reference'
 };
 
@@ -12,12 +11,11 @@ export const getStaticPaths = async () => {
 export function getStaticProps(context) {
   return {
     props: {
-      platform: context.params.platform,
-      category: context.params.category,
+      importName: context.params.importName,
       showBreadcrumbs: false,
-      meta
+      meta: {...meta, title: context.params.importName.join('/')}
     }
   };
 }
 
-<ReferencePage category={props.category} />
+<ReferencePage importName={props.importName.join('/')} />

src/pages/[platform]/reference/api/index.mdx

@@ -0,0 +1,32 @@
+import { getChildPageNodes } from '@/utils/getChildPageNodes';
+import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
+
+export const meta = {
+  title: 'API Docs',
+  description: 'Generated API docs for the Amplify repositories.',
+  route: '/[platform]/reference/api',
+  platforms: [
+    'angular',
+    'javascript',
+    'nextjs',
+    'react',
+    'react-native',
+    'vue',
+  ]
+};
+
+export async function getStaticPaths() {
+  return getCustomStaticPath(meta.platforms);
+}
+
+export function getStaticProps() {
+  const childPageNodes = getChildPageNodes(meta.route);
+  return {
+    props: {
+      meta,
+      childPageNodes
+    }
+  };
+}
+
+<Overview childPageNodes={props.childPageNodes} />