@hubspot/cli 7.8.0-experimental.0 → 7.8.2-experimental.0

package/ui/views/GetStarted.js

@@ -1,157 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useEffect } from 'react';
-import fs from 'fs-extra';
-import { useTerminalSize } from '../lib/useTerminalSize.js';
-import { uiAccountDescription } from '../../lib/ui/index.js';
-import { Box, Text } from 'ink';
-import figures from 'figures';
-import { AlertBox, InfoBox, } from '../components/StatusMessageBoxes.js';
-import { commands } from '../../lang/en.js';
-import Ascii from '../components/Ascii.js';
-import { HorizontalSelectPrompt } from '../components/HorizontalSelectPrompt.js';
-import { INK_COLORS } from '../styles.js';
-import { TextInput, Spinner, ConfirmInput, ThemeProvider, extendTheme, defaultTheme, Badge, } from '@inkjs/ui';
-import { getCwd } from '@hubspot/local-dev-lib/path';
-import path from 'path';
-import { cloneGithubRepo } from '@hubspot/local-dev-lib/github';
-import { HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, PROJECT_CONFIG_FILE, } from '../../lib/constants.js';
-import { getProjectConfig, validateProjectConfig, writeProjectConfig, } from '../../lib/projects/config.js';
-import { getProjectPackageJsonLocations, installPackages, } from '../../lib/dependencyManagement.js';
-import { handleProjectUpload } from '../../lib/projects/upload.js';
-import { useV3Api } from '../../lib/projects/platformVersion.js';
-import { pollProjectBuildAndDeploy } from '../../lib/projects/pollProjectBuildAndDeploy.js';
-import { getProjectBuildDetailUrl, getProjectDeployDetailUrl, } from '../../lib/projects/urls.js';
-import { BoxWithTitle } from '../components/BoxWithTitle.js';
-export function getGetStarted(props) {
-    return _jsx(GetStarted, { ...props });
-}
-const customTheme = extendTheme(defaultTheme, {
-    components: {
-        Spinner: {
-            styles: {
-                frame: () => ({
-                    color: '#FF7A59',
-                }),
-            },
-        },
-    },
-});
-export function GetStarted({ args }) {
-    const { derivedAccountId } = args;
-    const toolTips = [
-        'Run hs doctor to diagnose common cli installation problems',
-        'Use hs project add to quickly add new features to your project',
-        'Unified apps are coming to the cli soon',
-        'Use hs test-account create to create and seed test accounts',
-    ];
-    const accountName = uiAccountDescription(derivedAccountId);
-    const { columns, rows } = useTerminalSize();
-    const templateSource = 'robrown-hubspot/hubspot-project-components-ua-app-objects-beta';
-    const projectTemplate = {
-        name: 'private-app-get-started-template',
-        label: 'CRM getting started project with private apps',
-        path: 'projects/private-app-get-started-template',
-    };
-    const repo = templateSource || HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH;
-    const cloneRepo = async () => {
-        await cloneGithubRepo(repo, projectSource, {
-            sourceDir: projectTemplate.path,
-            tag: undefined,
-            hideLogs: true,
-        });
-        setIsCloned(true);
-    };
-    const [projectType, setProjectType] = useState('');
-    const [showProjectTypeError, setShowProjectTypeError] = useState(false);
-    const [projectName, setProjectName] = useState('');
-    const [projectSource, setProjectSource] = useState('');
-    const [isCloned, setIsCloned] = useState(false);
-    const [isConfigUpdated, setIsConfigUpdated] = useState(false);
-    const [areDepsInstalled, setAreDepsInstalled] = useState(false);
-    const [isUploading, setIsUploading] = useState(null);
-    const [isUploaded, setIsUploaded] = useState(false);
-    const [projectPollResult, setProjectPollResult] = useState(null);
-    useEffect(() => {
-        if (projectType === 'CMS') {
-            setShowProjectTypeError(true);
-        }
-        else {
-            setShowProjectTypeError(false);
-        }
-    }, [projectType]);
-    const updateProjectConfig = () => {
-        const projectConfigPath = path.join(projectSource, PROJECT_CONFIG_FILE);
-        const parsedConfigFile = JSON.parse(fs.readFileSync(projectConfigPath).toString());
-        writeProjectConfig(projectConfigPath, {
-            ...parsedConfigFile,
-            name: projectName,
-        });
-        setIsConfigUpdated(true);
-    };
-    const installDeps = async () => {
-        const installLocations = await getProjectPackageJsonLocations(projectSource);
-        await installPackages({
-            installLocations: installLocations,
-        });
-        setAreDepsInstalled(true);
-    };
-    useEffect(() => {
-        if (projectSource && !isCloned) {
-            setTimeout(() => {
-                cloneRepo();
-            }, 500);
-        }
-        if (projectSource && isCloned) {
-            setTimeout(() => {
-                updateProjectConfig();
-            }, 500);
-        }
-    }, [projectSource, isCloned]);
-    useEffect(() => {
-        if (isConfigUpdated && !areDepsInstalled) {
-            setTimeout(() => {
-                installDeps();
-            }, 500);
-        }
-    }, [isConfigUpdated]);
-    const uploadProject = async () => {
-        const { projectConfig: newProjectConfig, projectDir: newProjectDir } = await getProjectConfig(projectSource);
-        validateProjectConfig(newProjectConfig, newProjectDir);
-        const { result, uploadError } = await handleProjectUpload({
-            accountId: derivedAccountId,
-            projectConfig: newProjectConfig,
-            projectDir: newProjectDir,
-            callbackFunc: pollProjectBuildAndDeploy,
-            uploadMessage: 'Initial upload from get-started command',
-            forceCreate: true, // Auto-create project on HubSpot
-            isUploadCommand: false,
-            sendIR: useV3Api(newProjectConfig.platformVersion),
-            skipValidation: false,
-        });
-        if (result) {
-            setIsUploaded(true);
-            setProjectPollResult(result);
-        }
-    };
-    const [toolTipIndex, setToolTipIndex] = useState(0);
-    useEffect(() => {
-        const interval = setInterval(() => {
-            setToolTipIndex(prevIndex => (prevIndex + 1) % toolTips.length);
-        }, 5000);
-        return () => clearInterval(interval);
-    }, []);
-    useEffect(() => {
-        if (isUploading === true) {
-            setTimeout(() => {
-                uploadProject();
-            }, 500);
-        }
-    }, [isUploading]);
-    return (_jsx(ThemeProvider, { theme: customTheme, children: _jsxs(Box, { flexDirection: "column", width: columns, height: rows, children: [_jsx(Ascii, { text: "HubSpot CLI", font: "Standard" }), _jsx(InfoBox, { title: commands.getStarted.startTitle, message: commands.getStarted.startDescription +
-                        '\n' +
-                        commands.getStarted.guideOverview(accountName) }), projectType !== 'App' && (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(HorizontalSelectPrompt, { prompt: commands.getStarted.prompts.selectOption, options: ['App', 'CMS'], onSelect: setProjectType, defaultOption: 'App' }), showProjectTypeError && (_jsx(AlertBox, { title: "Bad Choice", message: "I didn't hook up the CMS flow for this demo" }))] })), projectType === 'App' && (_jsx(_Fragment, { children: _jsxs(Box, { flexDirection: "column", padding: 1, gap: 1, borderStyle: "round", borderColor: "#FF7A59", children: [_jsxs(Box, { flexDirection: "row", width: "100%", gap: 1, children: [_jsxs(Box, { flexDirection: "row", flexBasis: "50%", gap: 1, children: [_jsx(Text, { color: "#FF7A59", children: "Project Name:" }), projectName === '' ? (_jsx(TextInput, { placeholder: "give your project a name", onSubmit: setProjectName })) : (_jsx(Text, { children: projectName }))] }), _jsxs(Box, { flexDirection: "row", flexBasis: "50%", gap: 1, children: [_jsx(Text, { color: "#FF7A59", children: "Project Source:" }), projectSource === '' && projectName !== '' ? (_jsx(TextInput, { defaultValue: path.resolve(getCwd(), projectName), placeholder: path.resolve(getCwd(), projectName), onSubmit: setProjectSource })) : (_jsx(Text, { children: projectSource }))] })] }), projectSource && (_jsx(Box, { flexDirection: "row", width: "100%", gap: 1, children: isCloned ? (_jsxs(Text, { color: INK_COLORS.SUCCESS_GREEN, children: [figures.tick, " Project downloaded"] })) : (_jsx(Spinner, { type: "dots", label: "Downloading project" })) })), projectSource && isCloned && (_jsx(Box, { flexDirection: "row", width: "100%", gap: 1, children: isConfigUpdated ? (_jsxs(Text, { color: INK_COLORS.SUCCESS_GREEN, children: [figures.tick, " Project config updated"] })) : (_jsx(Spinner, { type: "dots", label: "Updating project config" })) })), isConfigUpdated && (_jsxs(Box, { flexDirection: "column", width: "100%", gap: 0, children: [_jsxs(Box, { flexDirection: "row", width: "100%", gap: 1, children: [_jsx(Badge, { color: INK_COLORS.SUCCESS_GREEN, children: "Success" }), _jsx(Text, { children: commands.project.create.logs.success(projectName, projectSource) })] }), _jsx(Text, { children: commands.getStarted.prompts.projectCreated.title }), _jsx(Text, { children: commands.getStarted.prompts.projectCreated.description })] })), isConfigUpdated && (_jsx(Box, { flexDirection: "row", width: "100%", gap: 1, children: areDepsInstalled ? (_jsxs(Text, { color: INK_COLORS.SUCCESS_GREEN, children: [figures.tick, " Project dependencies installed"] })) : (_jsx(Spinner, { type: "dots", label: "Installing project dependencies" })) })), areDepsInstalled && isUploading === null && (_jsxs(Box, { flexDirection: "row", width: "100%", gap: 1, children: [_jsx(Text, { color: INK_COLORS.WARNING_YELLOW, children: "Would you like to upload your project to HubSpot?" }), isUploading === null ? (_jsx(ConfirmInput, { onConfirm: () => {
-                                            setIsUploading(true);
-                                        }, onCancel: () => {
-                                            setIsUploading(false);
-                                        } })) : (_jsx(Text, { color: INK_COLORS.SUCCESS_GREEN, children: isUploading }))] })), isUploading === true && (_jsx(Box, { flexDirection: "row", width: "100%", gap: 1, children: isUploaded ? (_jsxs(Text, { color: INK_COLORS.SUCCESS_GREEN, children: [figures.tick, " Project uploaded, built, and deployed"] })) : (_jsx(Spinner, { type: "dots", label: "Uploading, building, and deploying project" })) })), projectPollResult && (_jsxs(Box, { flexDirection: "column", width: "100%", gap: 1, children: [_jsxs(Box, { flexDirection: "row", alignSelf: "center", width: "100%", gap: 1, children: [_jsx(Text, { color: "#FF7A59", children: "View build in HubSpot:" }), _jsx(Text, { color: INK_COLORS.INFO_BLUE, children: getProjectBuildDetailUrl(projectName, projectPollResult.buildId, derivedAccountId) })] }), _jsxs(Box, { flexDirection: "row", alignSelf: "center", width: "100%", gap: 1, children: [_jsx(Text, { color: "#FF7A59", children: "View deploy in HubSpot:" }), _jsx(Text, { color: INK_COLORS.INFO_BLUE, children: getProjectDeployDetailUrl(projectName, projectPollResult.deployResult?.deployId || 0, derivedAccountId) })] })] }))] }) })), _jsx(BoxWithTitle, { title: "Tips", message: toolTips[toolTipIndex], borderColor: "gray" })] }) }));
-}