wip new init flow

prisma · Aug 26, 2019 · 4185d75 · 4185d75
1 parent 1376998
commit 4185d75
Show file tree

Hide file tree

Showing 11 changed files with 89 additions and 36 deletions.
diff --git a/cli/introspection/.gitignore b/cli/introspection/.gitignore
@@ -2,4 +2,6 @@ src/debug-connection.ts
 *.md
 *.prisma
 failed-*.md
-test-introspection.ts
+test-introspection.ts
+dist
+node_modules
diff --git a/cli/introspection/src/prompt/components/InitState.tsx b/cli/introspection/src/prompt/components/InitState.tsx
@@ -4,12 +4,13 @@ import { Example } from '../types'
 import { DatabaseCredentials } from '../../types'
 
 export type DBType = 'postgres' | 'sqlite' | 'mysql'
-export type Language = 'blank' | 'ts' | 'js'
+export type Language = 'ts' | 'js'
 
 export type InitState = {
   selectedDb?: 'postgres' | 'sqlite' | 'mysql'
   selectedLanguage?: Language
   selectedExample?: Example
+  useBlank: boolean
   usePhoton: boolean
   useLift: boolean
   useDemoScript?: boolean
@@ -21,6 +22,7 @@ const initialState: InitState = {
   usePhoton: true,
   useLift: true,
   outputDir: process.cwd(),
+  useBlank: false,
 }
 
 const actions = {

diff --git a/cli/introspection/src/prompt/initPrompt.tsx b/cli/introspection/src/prompt/initPrompt.tsx
@@ -9,6 +9,7 @@ import Step61Success from './screens/Step61Success'
 import Step2SqliteFileSelection from './screens/Step2SqliteFileSelection'
 import Step21SqliteFilePath from './screens/Step21SqliteFilePath'
 import Step22ToolSelection from './screens/Step22ToolSelection'
+import Step3LanguageSelection from './screens/Step3LanguageSelection'
 import Step60ProcessBlank from './screens/Step60ProcessBlank'
 import Step4DemoScriptSelection from './screens/Step4DemoScriptSelection'
 import Step60DownloadExample from './screens/Step60DownloadExample'
@@ -25,6 +26,7 @@ export async function initPrompt(outputDir: string) {
             <Route path="sqlite-file-selection" component={<Step2SqliteFileSelection />} />
             <Route path="sqlite-file-path" component={<Step21SqliteFilePath />} />
             <Route path="tool-selection" component={<Step22ToolSelection />} />
+            <Route path="language-selection" component={<Step3LanguageSelection />} />
             <Route path="demo-script-selection" component={<Step4DemoScriptSelection />} />
             <Route path="process-blank" component={<Step60ProcessBlank />} />
             <Route path="download-example" component={<Step60DownloadExample />} />

diff --git a/cli/introspection/src/prompt/screens/Step0StarterVsBlank.tsx b/cli/introspection/src/prompt/screens/Step0StarterVsBlank.tsx
@@ -12,24 +12,19 @@ type Props = {
 
 const Step0StarterVsBlank: React.FC<Props> = ({ outputDir }) => {
   // already cache the result for later screens
-  const { setState } = useInitState()[1]
-  useEffect(() => {
-    // setState({ outputDir })
-  })
 
   useExampleApi()
   return (
     <Box flexDirection="column">
       <Box flexDirection="column" marginLeft={2}>
-        <Color bold>Select the language for a starter kit or start with a blank project.</Color>
+        <Color bold>Get started with a blank project or a starter kit.</Color>
         <Color dim>Starter kits provide ready-made setups for various use cases.</Color>
       </Box>
       <BorderBox flexDirection="column" title={chalk.bold('Languages for starter kits')} marginTop={1}>
         <Link
-          label="Javascript"
-          state={{ selectedLanguage: 'js' }}
-          href="starter-selection"
-          description="GraphQL, REST, gRPC, ..."
+          label="Blank project"
+          href="db-selection"
+          description="Supports introspecting your existing DB"
           tabIndex={0}
         />
         <Link
@@ -39,21 +34,6 @@ const Step0StarterVsBlank: React.FC<Props> = ({ outputDir }) => {
           description="GraphQL, REST, gRPC, ..."
           tabIndex={1}
         />
-        <Box marginLeft={2}>
-          <Color dim>Go (Coming soon)</Color>
-        </Box>
-        <Box marginLeft={2} marginTop={1}>
-          <Color dim>Note: Starter kits only work with empty databases</Color>
-        </Box>
-      </BorderBox>
-      <BorderBox flexDirection="column" title={chalk.bold('Get started from scratch')} marginBottom={1} marginTop={1}>
-        <Link
-          label="Blank Project"
-          href="db-selection"
-          description="Supports introspecting your existing DB"
-          state={{ selectedLanguage: 'blank' }}
-          tabIndex={2}
-        />
       </BorderBox>
     </Box>
   )

diff --git a/cli/introspection/src/prompt/screens/Step1StarterLanguageSelection.tsx b/cli/introspection/src/prompt/screens/Step1StarterLanguageSelection.tsx
@@ -0,0 +1,38 @@
+import React, { useEffect } from 'react'
+import { Color, Box } from 'ink'
+import BorderBox from '../components/BorderBox'
+import chalk from 'chalk'
+import { Link } from '../components/Link'
+import { useExampleApi } from '../utils/useExampleApi'
+import { useInitState } from '../components/InitState'
+
+type Props = {
+  outputDir: string
+}
+
+const Step1StarterLanguageSelection: React.FC<Props> = ({ outputDir }) => {
+  // already cache the result for later screens
+  const { setState } = useInitState()[1]
+  useEffect(() => {
+    // setState({ outputDir })
+  })
+
+  useExampleApi()
+  return (
+    <Box flexDirection="column">
+      <Box flexDirection="column" marginLeft={2} marginBottom={1}>
+        <Color bold>Select the language for your starter kit.</Color>
+      </Box>
+      <BorderBox flexDirection="column" title={chalk.bold('Starter kits are avaiable in the languages')} marginTop={1}>
+        <Link label="Javascript" state={{ selectedLanguage: 'js' }} href="starter-selection" tabIndex={0} />
+        <Link label="TypeScript" state={{ selectedLanguage: 'ts' }} href="starter-selection" tabIndex={1} />
+        <Box marginLeft={2}>
+          <Color dim>Go (Coming soon)</Color>
+        </Box>
+      </BorderBox>
+      <Link label="Back" description="(Project options)" tabIndex={2} kind="back" />
+    </Box>
+  )
+}
+
+export default Step1StarterLanguageSelection
diff --git a/cli/introspection/src/prompt/screens/Step22ToolSelection.tsx b/cli/introspection/src/prompt/screens/Step22ToolSelection.tsx
@@ -10,7 +10,7 @@ import { useInitState } from '../components/InitState'
 const Step22ToolSelection: React.FC = () => {
   const [state, { setState }] = useInitState()
 
-  const nextStep = state.usePhoton ? 'demo-script-selection' : 'process-blank'
+  const nextStep = state.usePhoton ? 'language-selection' : 'process-blank'
 
   return (
     <Box flexDirection="column">

diff --git a/cli/introspection/src/prompt/screens/Step2DBSelection.tsx b/cli/introspection/src/prompt/screens/Step2DBSelection.tsx
@@ -8,7 +8,7 @@ import { useInitState } from '../components/InitState'
 const Step2DBSelection: React.FC = () => {
   const [state] = useInitState()
 
-  const sqliteHref = state.selectedLanguage === 'blank' ? 'tool-selection' : 'download-example'
+  const sqliteHref = state.useBlank ? 'tool-selection' : 'download-example'
 
   return (
     <Box flexDirection="column">

diff --git a/cli/introspection/src/prompt/screens/Step3LanguageSelection.tsx b/cli/introspection/src/prompt/screens/Step3LanguageSelection.tsx
@@ -0,0 +1,32 @@
+import React from 'react'
+import { Color, Box } from 'ink'
+import BorderBox from '../components/BorderBox'
+import chalk from 'chalk'
+import { Link } from '../components/Link'
+import { useInitState } from '../components/InitState'
+
+const Step3LanguageSelection: React.FC = () => {
+  return (
+    <Box flexDirection="column">
+      <Box flexDirection="column" marginLeft={2}>
+        <Color bold>Select the programming language you want to use.</Color>
+        <Color dim>Specifies the language for Photon (database client).</Color>
+      </Box>
+      <BorderBox
+        flexDirection="column"
+        title={chalk.bold('Photon is available in these languages')}
+        marginTop={1}
+        marginBottom={1}
+      >
+        <Link label="JavaScript" href="demo-script-selection" tabIndex={0} state={{ selectedLanguage: 'js' }} />
+        <Link label="TypeScript" href="demo-script-selection" tabIndex={1} state={{ selectedLanguage: 'ts' }} />
+        <Box marginLeft={2}>
+          <Color dim>Go (Coming soon)</Color>
+        </Box>
+      </BorderBox>
+      <Link label="Back" href="home" description="(Tool selection)" tabIndex={3} kind="back" />
+    </Box>
+  )
+}
+
+export default Step3LanguageSelection
diff --git a/cli/introspection/src/prompt/screens/Step60ProcessBlank.tsx b/cli/introspection/src/prompt/screens/Step60ProcessBlank.tsx
@@ -22,8 +22,7 @@ const Step60ProcessBlank: React.FC = () => {
     }
     if (state.useDemoScript) {
       if (examples) {
-        // if (state.selectedLanguage === '')
-        //  setState(examples.examples.)
+        // ...
       }
     }
   }, [state, examples])

diff --git a/cli/introspection/src/prompt/screens/Step61Success.tsx b/cli/introspection/src/prompt/screens/Step61Success.tsx
@@ -79,9 +79,7 @@ const Step61Success: React.FC = () => {
           <Color>Explore sample operations and evolve the project:</Color>
           <Color bold>EXAMPLE_SHORTLINK</Color>
         </Box>
-        {state.selectedLanguage === 'blank' && (
-          <Color>We're missing some better text when you chose the blank flow... Coming soon</Color>
-        )}
+        {state.useBlank && <Color>We're missing some better text when you chose the blank flow... Coming soon</Color>}
       </BorderBox>
     </Box>
   )

diff --git a/cli/prisma2/package.json b/cli/prisma2/package.json
@@ -20,7 +20,7 @@
     "prisma2": "build/index.js"
   },
   "prisma": {
-    "version": "6146c81a771bef78248317cef9e37fc00863dc08"
+    "version": "bb28e2b89ea1694a6f7fe42b598c9f20241d26ef"
   },
   "devDependencies": {
     "@prisma/cli": "^0.0.49",
@@ -55,7 +55,7 @@
     "ncc": "ncc build dist/bin.js -o build",
     "ncc:download": "ncc build scripts/download.js -o download-build",
     "build": "yarn tsc && yarn ncc:download && rm -rf build && yarn ncc && sed -i.bak 's/env ts-node/env node/g' 'build/index.js' && rm -f build/index.js.bak && scripts/copy-runtime.sh",
-    "prepublishOnly": "node scripts/updateTag.js && yarn test && yarn build",
+    "prepublishOnly": "node scripts/updateTag.js && yarn install && yarn test && yarn build",
     "prepare": "yarn build && node download-build/index.js",
     "update-deps": "yarn upgrade --latest --scope @prisma"
   },
@@ -66,4 +66,4 @@
     "**/**/prisma-datamodel": "1.36.0-alpha.8",
     "**/**/**/prisma-datamodel": "1.36.0-alpha.8"
   }
-}
+}