diff --git a/config/eslintrc.react.js b/config/eslintrc.react.js index c580401..caedd7a 100644 --- a/config/eslintrc.react.js +++ b/config/eslintrc.react.js @@ -11,10 +11,11 @@ module.exports = { { extensions: ['.jsx', '.tsx'], }, - ], // also want to use with ".tsx" + ], // also want to use with ".tsx". + 'react/jsx-wrap-multilines': 'off', // This rule conflicts with prettier/prettier. 'react/prop-types': 'off', // Is this incompatible with TS props type? - 'react/jsx-wrap-multilines': 'off', // This rule conflicts with prettier/prettier - 'react/require-default-props': 'off', // Problems with function components + 'react/react-in-jsx-scope': 'off', // Do not required by TypeScript 4. + 'react/require-default-props': 'off', // Problems with function components. 'react-hooks/rules-of-hooks': 'error', 'relay/graphql-syntax': 'error', 'relay/compat-uses-vars': 'warn', diff --git a/packages/cli/src/deploy/staticApp/staticApp.template.ts b/packages/cli/src/deploy/staticApp/staticApp.template.ts index 5427eda..e2481f1 100644 --- a/packages/cli/src/deploy/staticApp/staticApp.template.ts +++ b/packages/cli/src/deploy/staticApp/staticApp.template.ts @@ -90,12 +90,19 @@ exports.handler = (event, context, callback) => { value: 'max-age=63072000; includeSubdomains; preload' } ]; - headers['content-security-policy'] = [ - { - key: 'Content-Security-Policy', - value: "default-src 'self'; img-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; object-src 'none'" - } - ]; + // headers['content-security-policy'] = [ + // { + // key: 'Content-Security-Policy', + // value: [ + // "default-src 'self'", + // "img-src 'self'", + // "script-src 'self'", + // "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com", + // "font-src 'self' https://fonts.gstatic.com", + // "object-src 'none'", + // ].join('; '), + // }, + // ]; headers['x-content-type-options'] = [{key: 'X-Content-Type-Options', value: 'nosniff'}]; headers['x-frame-options'] = [{key: 'X-Frame-Options', value: 'DENY'}]; headers['x-xss-protection'] = [{key: 'X-XSS-Protection', value: '1; mode=block'}]; diff --git a/packages/cli/src/deploy/staticApp/staticApp.ts b/packages/cli/src/deploy/staticApp/staticApp.ts index 3260700..6a66e98 100644 --- a/packages/cli/src/deploy/staticApp/staticApp.ts +++ b/packages/cli/src/deploy/staticApp/staticApp.ts @@ -89,6 +89,17 @@ export const invalidateCloudFront = async ({ } }; +/** + * # Deploy static app performs these steps: + * + * 1. Get the stack name that will be passed to CloudFormation. + * 2. Create a CloudFormation template based on the type of the deployment, + * for instance, only S3, SPA... + * 3. Create AWS resources using the templated created. + * 4. Upload static files to the host bucket S3. + * 5. If is a SPA and has CloudFront, an CloudFront invalidation will be + * created. + */ export const deployStaticApp = async ({ acmArn, acmArnExportedName, diff --git a/packages/cli/src/monorepo/templates/eslintrc.base.js.ts b/packages/cli/src/monorepo/templates/eslintrc.base.js.ts index 0e7cd1c..f7d774d 100644 --- a/packages/cli/src/monorepo/templates/eslintrc.base.js.ts +++ b/packages/cli/src/monorepo/templates/eslintrc.base.js.ts @@ -1,4 +1,4 @@ -export const templateName = '.eslintrc.base.js'; +export const templateName = 'eslintrc.base.js'; export const dir = 'config'; diff --git a/packages/cli/src/monorepo/templates/eslintrc.react.js.ts b/packages/cli/src/monorepo/templates/eslintrc.react.js.ts index e04e2aa..a59b449 100644 --- a/packages/cli/src/monorepo/templates/eslintrc.react.js.ts +++ b/packages/cli/src/monorepo/templates/eslintrc.react.js.ts @@ -1,4 +1,4 @@ -export const templateName = '.eslintrc.react.js'; +export const templateName = 'eslintrc.react.js'; export const dir = 'config'; diff --git a/packages/website/api/getMethodComment.ts b/packages/website/api/getMethodComment.ts new file mode 100644 index 0000000..073d01d --- /dev/null +++ b/packages/website/api/getMethodComment.ts @@ -0,0 +1,17 @@ +import jsdoc from 'jsdoc-api'; +import path from 'path'; + +export const getMethodComment = ({ + pathFromDist, + method, +}: { + pathFromDist: string; + method: string; +}): string => { + const res = jsdoc.explainSync({ + files: path.resolve(process.cwd(), '../cli/dist', pathFromDist), + }); + const { description } = + res.find(({ name, kind }) => name === method && kind === 'function') || {}; + return description; +}; diff --git a/packages/website/components/CodeBlock.tsx b/packages/website/components/CodeBlock.tsx index 94daf38..9b3e9e6 100644 --- a/packages/website/components/CodeBlock.tsx +++ b/packages/website/components/CodeBlock.tsx @@ -1,37 +1,15 @@ -/* eslint-disable react/no-array-index-key */ -import * as React from 'react'; - -import Highlight, { defaultProps } from 'prism-react-renderer'; -import dracula from 'prism-react-renderer/themes/dracula'; - -const CodeBlock = ({ children, className = 'sh' }: any) => { - const language = (className || 'sh').replace(/language-/, ''); +/** @jsx jsx */ +import Prism from '@theme-ui/prism'; +import { jsx } from 'theme-ui'; +const CodeBlock: React.FC<{ className?: string }> = ({ + children, + className = 'sh', +}) => { return ( - - {({ - className: highlightClassName, - style, - tokens, - getLineProps, - getTokenProps, - }) => ( - 
-          {tokens.map((line, i) => (
-            

-              {line.map((token, key) => (
-                
-              ))}
-            

-          ))}
-
- )} - + + {children} + ); }; diff --git a/packages/website/components/Layout.tsx b/packages/website/components/Layout.tsx index d19d723..e5921ab 100644 --- a/packages/website/components/Layout.tsx +++ b/packages/website/components/Layout.tsx @@ -1,22 +1,35 @@ -import * as React from 'react'; - +/** @jsx jsx */ import Link from 'next/link'; +import { Container, Styled, jsx } from 'theme-ui'; import { commands } from '../api/commands'; const Layout: React.FC = ({ children }) => { return ( <> -
Carlin
-
-