Merge branch 'develop' into cloudwatch

* develop:
  docs: add Alb as a supported model
  docs: shadow sidebar to remain expanded
  feat: Add alb lambda event support to Parser utility #228

Author: heitorlessa

aws_lambda_powertools/utilities/parser/models/__init__.py

@@ -1,3 +1,4 @@
+from .alb import AlbModel, AlbRequestContext, AlbRequestContextData
 from .cloudwatch import CloudWatchLogsData, CloudWatchLogsDecode, CloudWatchLogsLogEvent, CloudWatchLogsModel
 from .dynamodb import DynamoDBStreamChangedRecordModel, DynamoDBStreamModel, DynamoDBStreamRecordModel
 from .event_bridge import EventBridgeModel
@@ -10,6 +11,9 @@
     "CloudWatchLogsDecode",
     "CloudWatchLogsLogEvent",
     "CloudWatchLogsModel",
+    "AlbModel",
+    "AlbRequestContext",
+    "AlbRequestContextData",
     "DynamoDBStreamModel",
     "EventBridgeModel",
     "DynamoDBStreamChangedRecordModel",

aws_lambda_powertools/utilities/parser/models/alb.py

@@ -0,0 +1,21 @@
+from typing import Dict
+
+from pydantic import BaseModel
+
+
+class AlbRequestContextData(BaseModel):
+    targetGroupArn: str
+
+
+class AlbRequestContext(BaseModel):
+    elb: AlbRequestContextData
+
+
+class AlbModel(BaseModel):
+    httpMethod: str
+    path: str
+    body: str
+    isBase64Encoded: bool
+    headers: Dict[str, str]
+    queryStringParameters: Dict[str, str]
+    requestContext: AlbRequestContext

docs/content/utilities/parser.mdx

@@ -156,6 +156,7 @@ Model name | Description
 **DynamoDBStreamModel** | Lambda Event Source payload for Amazon DynamoDB Streams
 **EventBridgeModel** | Lambda Event Source payload for Amazon EventBridge
 **SqsModel** | Lambda Event Source payload for Amazon SQS
+**AlbModel** | Lambda Event Source payload for Amazon Application Load Balancer
 **CloudwatchLogsModel** | Lambda Event Source payload for Amazon CloudWatch Logs
 
 You can extend them to include your own models, and yet have all other known fields parsed along the way.

docs/src/gatsby-theme-apollo-docs/components/multi-code-block.js

@@ -0,0 +1,127 @@
+import PropTypes from 'prop-types';
+import React, {createContext, useContext, useMemo} from 'react';
+import styled from '@emotion/styled';
+import {trackCustomEvent} from 'gatsby-plugin-google-analytics';
+
+export const GA_EVENT_CATEGORY_CODE_BLOCK = 'Code Block';
+export const MultiCodeBlockContext = createContext({});
+export const SelectedLanguageContext = createContext();
+
+const Container = styled.div({
+  position: 'relative'
+});
+
+const langLabels = {
+  js: 'JavaScript',
+  ts: 'TypeScript',
+  'hooks-js': 'Hooks (JS)',
+  'hooks-ts': 'Hooks (TS)'
+};
+
+function getUnifiedLang(language) {
+  switch (language) {
+    case 'js':
+    case 'jsx':
+    case 'javascript':
+      return 'js';
+    case 'ts':
+    case 'tsx':
+    case 'typescript':
+      return 'ts';
+    default:
+      return language;
+  }
+}
+
+function getLang(child) {
+  return getUnifiedLang(child.props['data-language']);
+}
+
+export function MultiCodeBlock(props) {
+  const {codeBlocks, titles} = useMemo(() => {
+    const defaultState = {
+      codeBlocks: {},
+      titles: {}
+    };
+
+    if (!Array.isArray(props.children)) {
+      return defaultState;
+    }
+
+    return props.children.reduce((acc, child, index, array) => {
+      const lang = getLang(child);
+      if (lang) {
+        return {
+          ...acc,
+          codeBlocks: {
+            ...acc.codeBlocks,
+            [lang]: child
+          }
+        };
+      }
+
+      if (child.props.className === 'gatsby-code-title') {
+        const nextNode = array[index + 1];
+        const title = child.props.children;
+        const lang = getLang(nextNode);
+        if (nextNode && title && lang) {
+          return {
+            ...acc,
+            titles: {
+              ...acc.titles,
+              [lang]: title
+            }
+          };
+        }
+      }
+
+      return acc;
+    }, defaultState);
+  }, [props.children]);
+
+  const languages = useMemo(() => Object.keys(codeBlocks), [codeBlocks]);
+  const [selectedLanguage, setSelectedLanguage] = useContext(
+    SelectedLanguageContext
+  );
+
+  if (!languages.length) {
+    return props.children;
+  }
+
+  function handleLanguageChange(language) {
+    setSelectedLanguage(language);
+    trackCustomEvent({
+      category: GA_EVENT_CATEGORY_CODE_BLOCK,
+      action: 'Change language',
+      label: language
+    });
+  }
+
+  const defaultLanguage = languages[0];
+  const renderedLanguage =
+    selectedLanguage in codeBlocks ? selectedLanguage : defaultLanguage;
+
+  return (
+    <Container>
+      <MultiCodeBlockContext.Provider
+        value={{
+          selectedLanguage: renderedLanguage,
+          languages: languages.map(lang => ({
+            lang,
+            label:
+              // try to find a label or capitalize the provided lang
+              langLabels[lang] || lang.charAt(0).toUpperCase() + lang.slice(1)
+          })),
+          onLanguageChange: handleLanguageChange
+        }}
+      >
+        <div className="gatsby-code-title">{titles[renderedLanguage]}</div>
+        {codeBlocks[renderedLanguage]}
+      </MultiCodeBlockContext.Provider>
+    </Container>
+  );
+}
+
+MultiCodeBlock.propTypes = {
+  children: PropTypes.node.isRequired
+};