diff --git a/cli-ext/package.json b/cli-ext/package.json index 58ba9aad..3a62acb8 100644 --- a/cli-ext/package.json +++ b/cli-ext/package.json @@ -8,7 +8,7 @@ "pretranspile": "npm run get-shared-modules", "transpile": "rm -rf build/* && babel ./src ./tests --out-dir build", "prebuild": "npm run transpile", - "build": "rm -rf ./bin/* && pkg ./build/command.js --output ./bin/cli-ext-hasura -t node8-linux-x64,node8-macos-x64,node8-win-x64", + "build": "rm -rf ./bin/* && pkg ./build/command.js --output ./bin/cli-ext-hasura -t node12-linux-x64,node12-macos-x64,node12-win-x64", "pretest": "npm run transpile && babel ./tests --out-dir _tmptests", "posttest": "rm -rf _tmptests", "test": "node ./_tmptests/index.js" @@ -29,4 +29,4 @@ "@babel/plugin-transform-async-to-generator": "^7.7.4", "@babel/preset-env": "^7.7.6" } -} \ No newline at end of file +} diff --git a/cli/commands/actions_use_codegen.go b/cli/commands/actions_use_codegen.go index e066e2c4..62dc69ce 100644 --- a/cli/commands/actions_use_codegen.go +++ b/cli/commands/actions_use_codegen.go @@ -120,17 +120,6 @@ func (o *actionsUseCodegenOptions) run() error { o.withStarterKit = shouldCloneStarterKit == "y" } - // if output directory is not provided, make them enter it - if o.outputDir == "" { - outputDir, err := util.GetFSPathPrompt("Where do you want to place the codegen files?", o.EC.Config.ActionConfig.Codegen.OutputDir) - if err != nil { - return errors.Wrap(err, "error in getting output directory input") - } - newCodegenExecutionConfig.OutputDir = outputDir - } else { - newCodegenExecutionConfig.OutputDir = o.outputDir - } - // clone the starter kit o.EC.Spin("Clonning the starter kit...") if o.withStarterKit && hasStarterKit { @@ -158,6 +147,18 @@ func (o *actionsUseCodegenOptions) run() error { } o.EC.Logger.Info("Starter kit cloned at " + destinationDir) } + o.EC.Spinner.Stop() + + // if output directory is not provided, make them enter it + if o.outputDir == "" { + outputDir, err := util.GetFSPathPrompt("Where do you want to place the codegen files?", o.EC.Config.ActionConfig.Codegen.OutputDir) + if err != nil { + return errors.Wrap(err, "error in getting output directory input") + } + newCodegenExecutionConfig.OutputDir = outputDir + } else { + newCodegenExecutionConfig.OutputDir = o.outputDir + } newConfig := o.EC.Config newConfig.ActionConfig.Codegen = newCodegenExecutionConfig diff --git a/cli/util/prompt.go b/cli/util/prompt.go index 031f166f..e63990c8 100644 --- a/cli/util/prompt.go +++ b/cli/util/prompt.go @@ -12,7 +12,6 @@ const ( ) func GetYesNoPrompt(message string) (promptResp string, err error) { - prompt := promptui.Prompt{ Label: message + " (y/n)", Validate: func(_resp string) (err error) { @@ -28,15 +27,12 @@ func GetYesNoPrompt(message string) (promptResp string, err error) { }, Default: "y", } - promptResp, err = prompt.Run() if err != nil { return } promptResp = string(strings.ToLower(promptResp)[0]) - return - } func GetSelectPrompt(message string, options []string) (selection string, err error) { @@ -44,22 +40,15 @@ func GetSelectPrompt(message string, options []string) (selection string, err er Label: message, Items: options, } - _, selection, err = prompt.Run() - return } func GetFSPathPrompt(message string, def string) (input string, err error) { - prompt := promptui.Prompt{ Label: message, Validate: FSCheckIfDirPathExists, Default: def, } - - input, err = prompt.Run() - - return - + return prompt.Run() } diff --git a/console/src/components/Common/Common.scss b/console/src/components/Common/Common.scss index 95fd6e15..6de516a9 100644 --- a/console/src/components/Common/Common.scss +++ b/console/src/components/Common/Common.scss @@ -1404,6 +1404,13 @@ code { margin-right: 50px !important; } +.marginLeftAuto { + margin-left: auto; +} + +.textAlignRight { + text-align: right; +} /* container height subtracting top header and bottom scroll bar */ $mainContainerHeight: calc(100vh - 50px - 25px); diff --git a/console/src/components/Services/Actions/Add/Add.js b/console/src/components/Services/Actions/Add/Add.js index 4dccbc2f..d4642457 100644 --- a/console/src/components/Services/Actions/Add/Add.js +++ b/console/src/components/Services/Actions/Add/Add.js @@ -86,9 +86,11 @@ const AddAction = ({ let actionType; if (!actionDefinitionError) { // TODO optimise - const { type, error } = getActionDefinitionFromSdl(actionDefinitionSdl); - if (!error) { - actionType = type; + if (!actionParseTimer) { + const { type, error } = getActionDefinitionFromSdl(actionDefinitionSdl); + if (!error) { + actionType = type; + } } } @@ -120,18 +122,16 @@ const AddAction = ({ service="create-action" />
- { - actionType === "query" ? null : ( - - -
- - ) - } + {actionType === 'query' ? null : ( + + +
+ + )} { setLoading(true); + setError(null); getFrameworkCodegen( framework, currentAction.action_name, @@ -45,7 +47,7 @@ const CodeTabs = ({ return (
Error generating code.  - Try again + Try again
); } diff --git a/console/src/components/Services/Actions/Codegen/Codegen.js b/console/src/components/Services/Actions/Codegen/Codegen.js index ea8fb982..1992b4b5 100644 --- a/console/src/components/Services/Actions/Codegen/Codegen.js +++ b/console/src/components/Services/Actions/Codegen/Codegen.js @@ -4,12 +4,13 @@ import { getSdlComplete } from '../../../../shared/utils/sdlUtils'; import { getAllCodegenFrameworks, getStarterKitPath, + getStarterKitDownloadPath, getGlitchProjectURL, } from './utils'; import { getPersistedDerivedAction } from '../lsUtils'; import Spinner from '../../../Common/Spinner/Spinner'; import styles from '../Common/components/Styles.scss'; -import Button from '../../../Common/Button/Button'; +import { Icon } from '../../../UIKit/atoms'; import CodeTabs from './CodeTabs'; import DerivedFrom from './DerivedFrom'; @@ -31,6 +32,7 @@ const Codegen = ({ allActions, allTypes, currentAction }) => { const init = () => { setLoading(true); + setError(null); getAllCodegenFrameworks() .then(frameworks => { setAllFrameworks(frameworks); @@ -54,7 +56,9 @@ const Codegen = ({ allActions, allTypes, currentAction }) => { return (
Error fetching codegen assets.  - Try again + + Try again +
); } @@ -89,13 +93,9 @@ const Codegen = ({ allActions, allTypes, currentAction }) => { href={getGlitchProjectURL()} target="_blank" rel="noopener noreferrer" + className={styles.add_mar_right} > - + Try on glitch ); }; @@ -110,24 +110,57 @@ const Codegen = ({ allActions, allTypes, currentAction }) => { ) { return null; } + return ( - - - + + + Starter-kit.zip + + + View + on GitHub + + + ); + }; + + const getHelperToolsSection = () => { + const glitchButton = getGlitchButton(); + const starterKitButtons = getStarterKitButton(); + if (!glitchButton && !starterKitButtons) { + return null; + } + return ( +
+
+ Need help getting started quickly? +
+
+ {getGlitchButton()} + {getStarterKitButton()} +
+
); }; return (
{getDrodown()} - {getGlitchButton()} - {getStarterKitButton()} + {getHelperToolsSection()}
); }; diff --git a/console/src/components/Services/Actions/Codegen/utils.js b/console/src/components/Services/Actions/Codegen/utils.js index ca486a90..f6521d41 100644 --- a/console/src/components/Services/Actions/Codegen/utils.js +++ b/console/src/components/Services/Actions/Codegen/utils.js @@ -24,6 +24,9 @@ export const getStarterKitPath = framework => { return `https://github.com/${CODEGEN_REPO}/tree/master/${framework}/starter-kit/`; }; +export const getStarterKitDownloadPath = framework => { + return `https://github.com/${CODEGEN_REPO}/raw/master/${framework}/${framework}.zip`; +}; export const getGlitchProjectURL = () => { return 'https://glitch.com/edit/?utm_content=project_hasura-actions-starter-kit&utm_source=remix_this&utm_medium=button&utm_campaign=glitchButton#!/remix/hasura-actions-starter-kit'; }; diff --git a/console/src/components/Services/Actions/Common/components/ActionDefinitionEditor.js b/console/src/components/Services/Actions/Common/components/ActionDefinitionEditor.js index b5588d24..7b8667a1 100644 --- a/console/src/components/Services/Actions/Common/components/ActionDefinitionEditor.js +++ b/console/src/components/Services/Actions/Common/components/ActionDefinitionEditor.js @@ -69,7 +69,7 @@ const ActionDefinitionEditor = ({ {error && (
-

{errorMessage}

+
{errorMessage}
)} diff --git a/console/src/components/Services/Actions/Common/components/Styles.scss b/console/src/components/Services/Actions/Common/components/Styles.scss index 232d133f..77b9140e 100644 --- a/console/src/components/Services/Actions/Common/components/Styles.scss +++ b/console/src/components/Services/Actions/Common/components/Styles.scss @@ -31,4 +31,3 @@ .cloneTypeText { margin-left: auto; } - diff --git a/console/src/components/Services/Actions/Common/components/TypeDefinitionEditor.js b/console/src/components/Services/Actions/Common/components/TypeDefinitionEditor.js index fdd66ae3..deda48d5 100644 --- a/console/src/components/Services/Actions/Common/components/TypeDefinitionEditor.js +++ b/console/src/components/Services/Actions/Common/components/TypeDefinitionEditor.js @@ -79,24 +79,27 @@ const ActionDefinitionEditor = ({
{errorMessage}
)} - - - Clone an existing type - - - - + {/* + + + Clone an existing type + + + + + + */}
- { - actionType === "query" ? null : ( - - -
- - ) - } + {actionType === 'query' ? null : ( + + +
+ + )} (dispatch, getState) => { outputType, error: actionDefError, comment: actionDescription, - type: actionType + type: actionType, } = getActionDefinitionFromSdl(rawState.actionDefinition.sdl); if (actionDefError) { return dispatch( diff --git a/console/src/components/Services/Actions/utils.js b/console/src/components/Services/Actions/utils.js index 28f6640c..1066db4e 100644 --- a/console/src/components/Services/Actions/utils.js +++ b/console/src/components/Services/Actions/utils.js @@ -27,7 +27,7 @@ export const getActionArguments = action => { }; export const getActionType = action => { - return action.action_defn.type + return action.action_defn.type; }; export const getAllActions = getState => { diff --git a/console/src/components/Services/ApiExplorer/GraphiQLWrapper/GraphiQLWrapper.js b/console/src/components/Services/ApiExplorer/GraphiQLWrapper/GraphiQLWrapper.js index 215c087c..74f9d7fc 100644 --- a/console/src/components/Services/ApiExplorer/GraphiQLWrapper/GraphiQLWrapper.js +++ b/console/src/components/Services/ApiExplorer/GraphiQLWrapper/GraphiQLWrapper.js @@ -20,6 +20,7 @@ import { } from '../../../../shared/utils/sdlUtils'; import { showErrorNotification } from '../../Common/Notification'; import { getActionsCreateRoute } from '../../../Common/utils/routesUtils'; +import { getConfirmation } from '../../../Common/utils/jsUtils'; import { setActionDefinition, setTypeDefinition, @@ -111,13 +112,19 @@ class GraphiQLWrapper extends Component { console.error(e); return; } - const { action, types } = derivedOperationMetadata; + const { action, types, variables } = derivedOperationMetadata; const actionsSdl = getActionDefinitionSdl( action.name, action.type, action.arguments, action.output_type ); + if (variables && !variables.length) { + const ok = getConfirmation( + `Looks like your ${action.type} does not have variables. This means that the derived action will have no arguments.` + ); + if (!ok) return; + } const typesSdl = getTypesSdl(types); dispatch( setActionDefinition(actionsSdl, null, null, sdlParse(actionsSdl)) diff --git a/console/src/components/UIKit/atoms/Icon/Icon.js b/console/src/components/UIKit/atoms/Icon/Icon.js index 6e84a6fe..fca92d7f 100644 --- a/console/src/components/UIKit/atoms/Icon/Icon.js +++ b/console/src/components/UIKit/atoms/Icon/Icon.js @@ -2,6 +2,8 @@ import styled from 'styled-components'; import { color, typography, layout, space } from 'styled-system'; export const StyledIcon = styled.svg` + cursor: ${({ pointer }) => (pointer ? 'pointer' : '')}; + ${color} ${typography} ${layout} diff --git a/console/src/components/UIKit/atoms/Icon/index.js b/console/src/components/UIKit/atoms/Icon/index.js index 544b5bcc..4d0de2f0 100644 --- a/console/src/components/UIKit/atoms/Icon/index.js +++ b/console/src/components/UIKit/atoms/Icon/index.js @@ -10,9 +10,48 @@ import { FaCloud, FaCog, FaQuestion, + FaCogs, + FaExclamation, + FaTimes, + FaStar, + FaTwitter, + FaHeart, + FaChevronRight, + FaCompressArrowsAlt, + FaExpand, + FaEdit, + FaChevronDown, + FaSearch, + FaSpinner, + FaQuestionCircle, + FaPause, + FaPlay, + FaCheck, + FaRedoAlt, + FaChevronUp, + FaTrashAlt, + FaPencilAlt, + FaPlus, + FaEye, + FaUserSecret, + FaRegLightbulb, + FaSort, + FaCaretUp, + FaCaretDown, + FaCaretRight, + FaCaretLeft, + FaRegClone, + FaRegCaretSquareRight, + FaCopy, + FaExternalLinkAlt, + FaTable, + FaFilter, + FaWrench, + FaRegPaperPlane, + FaCodeBranch, + FaGithub, + FaDownload, } from 'react-icons/fa'; - -import { theme } from '../../theme'; import { StyledIcon } from './Icon'; const iconReferenceMap = { @@ -20,37 +59,63 @@ const iconReferenceMap = { info: FaInfoCircle, warning: FaExclamationTriangle, error: FaExclamationCircle, - graphiql: FaFlask, + graphiQL: FaFlask, database: FaDatabase, schema: FaPlug, event: FaCloud, settings: FaCog, question: FaQuestion, default: FaExclamationCircle, + action: FaCogs, + exclamation: FaExclamation, + close: FaTimes, + star: FaStar, + twitter: FaTwitter, + love: FaHeart, + right: FaChevronRight, + down: FaChevronDown, + up: FaChevronUp, + compress: FaCompressArrowsAlt, + expand: FaExpand, + edit: FaEdit, + pencil: FaPencilAlt, + search: FaSearch, + spinner: FaSpinner, + questionCircle: FaQuestionCircle, + pause: FaPause, + play: FaPlay, + playBox: FaRegCaretSquareRight, + check: FaCheck, + reload: FaRedoAlt, + delete: FaTrashAlt, + add: FaPlus, + eye: FaEye, + secret: FaUserSecret, + lightBulb: FaRegLightbulb, + sort: FaSort, + caretUp: FaCaretUp, + caretDown: FaCaretDown, + caretRight: FaCaretRight, + caretLeft: FaCaretLeft, + clone: FaRegClone, + copy: FaCopy, + link: FaExternalLinkAlt, + table: FaTable, + filter: FaFilter, + wrench: FaWrench, + send: FaRegPaperPlane, + fork: FaCodeBranch, + github: FaGithub, + download: FaDownload, }; -const iconWidth = 18; -const iconHeight = 18; - export const Icon = props => { const { type } = props; - - const { icon } = theme; - - const iconColor = icon[type] ? icon[type].color : icon.default.color; - const CurrentActiveIcon = iconReferenceMap[type] ? iconReferenceMap[type] : iconReferenceMap.default; - - return ( - - ); + return