Formalize TypeScrip type definition generation

[peterp]

This is a two part PR, this is part one.

In this PR I've formalize TypeScript type definition generation by...

• Moving all of the type generation from the babel plugins into @redwoodjs/internal
• Introducing "virtual mirror directory" of types for cells and directory named modules.
• Created file finders so that we can find directory named modules and cells modules.
• Created AST and JSX helpers to assist in creating the type definitions and identifying types of files.

The file finders I've created are:

• findCells()
• findDirectoryNamedModules()

The AST helpers I've created are:

• getNamedExports(code): returns all the named exports in a module.
• hasDefaultExport(code): boolean that indicates if a module has a default export.

The JSX helper:

• getJsxElements(code, 'Router'): This will create a simple tree of components that's easily parseable:

Given the following code...

export const Router = () => {
      return (
        <Router>
          <Set private>
            <Route path={"/" + "home"} name="home" page={HomePage} />
            <Route path="/login" name="login" page={LoginPage} />
            <Route path="/404" name="404" page={() => '404 - Not Found.'} />
          </Set>
        </Router>
      )
    }

You'll receive...

getJsxElements(code, 'Router')
// Returns:
[
  {
    "name": "Router",
    "props": {},
    "children": [
      {
        "name": "Set",
        "props": {
          "private": true
        },
        "children": [
          {
            "name": "Route",
            "props": {
              "path": "/home",
              "name": "home",
              "page": "HomePage"
            },
            "children": []
          },
          {
            "name": "Route",
            "props": {
              "path": "/login",
              "name": "login",
              "page": "LoginPage"
            },
            "children": []
          },
          {
            "name": "Route",
            "props": {
              "path": "/404",
              "name": "404",
              "page": "ArrowFunctionExpression is not supported"
            },
            "children": []
          }
        ]
      }
    ]
  }
]

getJsxElements(code, 'Route')
// Returns:
[
  {
    "name": "Route",
    "props": {
      "path": "/home",
      "name": "home",
      "page": "HomePage"
    },
    "children": []
  },
  {
    "name": "Route",
    "props": {
      "path": "/login",
      "name": "login",
      "page": "LoginPage"
    },
    "children": []
  },
  {
    "name": "Route",
    "props": {
      "path": "/404",
      "name": "404",
      "page": "ArrowFunctionExpression is not supported"
    },
    "children": []
  }
]

The second part of this PR will add a file watching process that will trigger type definition creation when certain files are created, deleted or modified.

[cypress]

---

Test summary

17 • 0 • 0 • 0 • 0

---

Run details

Project	RedwoodJS Framework
Status	Passed
Commit	dd5f400 ℹ️
Started	May 23, 2021 5:25 PM
Ended	May 23, 2021 5:30 PM
Duration	04:21 💡
OS	Linux Ubuntu - 20.04
Browser	Chrome 90

View run in Cypress Dashboard ➡️

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

[github-actions]

📦 PR Packages

Click to Show Package Download Links

https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/create-redwood-app-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-api-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-api-server-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-auth-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-cli-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-core-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-dev-server-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-eslint-config-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-eslint-plugin-redwood-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-forms-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-internal-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-prerender-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-router-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-structure-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-testing-0.31.2-c722e19.tgz
https://rw-pr-redwoodjs-com.s3.amazonaws.com/2486/redwoodjs-web-0.31.2-c722e19.tgz

Install this PR by running yarn rw upgrade --pr 2486:0.31.2-c722e19

[peterp]

Closing for #2614