Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: onboarding agenturl fix with save button #219

Merged
merged 1 commit into from
Nov 8, 2024
Merged

fix: onboarding agenturl fix with save button #219

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
137 changes: 71 additions & 66 deletions src/screens/config/config.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,49 +51,53 @@ export function Config(props: any): JSX.Element {
}
};

const handleSetAgentUrl = async (_url: string) => {
if (!_url || !isValidUrl(_url)) {
const validateAgentUrl = () => {
if (!agentUrl || !isValidUrl(agentUrl)) {
setAgentUrlError(validUrlMsg);
return;
return false;
}
setAgentUrlError("");
return true;
};

await configService.setAgentUrl(_url);
setAgentUrl(_url);
const validateBootUrl = () => {
if (!bootUrl || !isValidUrl(bootUrl)) {
setBootUrlError(validUrlMsg);
return false;
}
setBootUrlError("");
return true;
};

const handleSetAgentUrl = async () => {
await configService.setAgentUrl(agentUrl);
setAgentUrl(agentUrl);
setAgentUrlError("");

if (!hasOnboarded) {
await configService.setHasOnboarded(true);
props.handleBack();
}
return true;
};

const handleSetBootUrl = async (_url: string) => {
if (_url) {
if (!isValidUrl(_url)) {
setBootUrlError(validUrlMsg);
return;
}

await configService.setBootUrl(_url);
setBootUrl(_url);
setBootUrlError("");
} else {
await configService.setBootUrl("");
setBootUrl("");
setBootUrlError("");
}
const handleSetBootUrl = async () => {
await configService.setBootUrl(bootUrl);
setBootUrl(bootUrl);
setBootUrlError("");

props.afterBootUrlUpdate();
return true;
};

const handleSetVendorUrl = async () => {
let hasError = checkErrorVendorUrl();
try {
const resp = await (await fetch(vendorUrl)).json();
if (resp?.agentUrl) {
await handleSetAgentUrl(resp?.agentUrl);
setAgentUrl(resp?.agentUrl);
}
if (resp?.bootUrl) {
await handleSetBootUrl(resp?.bootUrl);
setBootUrl(resp?.bootUrl);
}
await configService.setVendorData(resp);
if (resp?.icon) {
Expand All @@ -109,17 +113,20 @@ export function Config(props: any): JSX.Element {
}
};

const handleSave = async () => {
const handleLoadVendorUrl = async () => {
const hasError = checkErrorVendorUrl();
if (hasError) return;
await handleSetVendorUrl();
};

const handleBack = async () => {
if (!agentUrl || !isValidUrl(agentUrl)) {
setAgentUrlError(validUrlMsg);
return;
}
const handleSave = async () => {
const agentUrlSuccess = validateAgentUrl();
const bootUrlSuccess = validateBootUrl();

if (!agentUrlSuccess || !bootUrlSuccess) return;

await handleSetAgentUrl();
await handleSetBootUrl();
props.handleBack();
};

Expand All @@ -136,56 +143,54 @@ export function Config(props: any): JSX.Element {
onBlur={checkErrorVendorUrl}
/>
<Box position="absolute" right="16px" bottom="-28px">
<Button handleClick={handleSave}>
<Button handleClick={handleLoadVendorUrl}>
<Text $color="">{formatMessage({ id: "action.load" })}</Text>
</Button>
</Box>
</Box>
<Box paddingX={3}>
<Input
id="agent_url"
label={`${formatMessage({ id: "config.agentUrl.label" })} *`}
error={agentUrlError}
placeholder={formatMessage({ id: "config.agentUrl.placeholder" })}
value={agentUrl}
onChange={(e) => setAgentUrl(e.target.value)}
onBlur={() => handleSetAgentUrl(agentUrl)}
/>
</Box>
<Box paddingX={3}>
<Input
id="boot_url"
label={`${formatMessage({ id: "config.bootUrl.label" })} *`}
error={bootUrlError}
placeholder={formatMessage({ id: "config.bootUrl.placeholder" })}
value={bootUrl}
onChange={(e) => setBootUrl(e.target.value)}
onBlur={() => handleSetBootUrl(bootUrl)}
/>
</Box>
<Box paddingX={3}>
<Dropdown
label={formatMessage({ id: "config.language.label" })}
selectedOption={langMap.find((s) => s.value === currentLocale)}
options={langMap}
onSelect={(option) => changeLocale(option.value)}
/>
</Box>
{hasOnboarded ? (
<Box>
<Box paddingX={3}>
<Input
id="agent_url"
label={`${formatMessage({ id: "config.agentUrl.label" })} *`}
error={agentUrlError}
placeholder={formatMessage({ id: "config.agentUrl.placeholder" })}
value={agentUrl}
onChange={(e) => setAgentUrl(e.target.value)}
onBlur={() => validateAgentUrl()}
/>
</Box>
<Box paddingX={3}>
<Input
id="boot_url"
label={`${formatMessage({ id: "config.bootUrl.label" })} *`}
error={bootUrlError}
placeholder={formatMessage({ id: "config.bootUrl.placeholder" })}
value={bootUrl}
onChange={(e) => setBootUrl(e.target.value)}
onBlur={() => validateBootUrl()}
/>
</Box>
<Box paddingX={3}>
<Dropdown
label={formatMessage({ id: "config.language.label" })}
selectedOption={langMap.find((s) => s.value === currentLocale)}
options={langMap}
onSelect={(option) => changeLocale(option.value)}
/>
</Box>
<Flex
fontSize={0}
flexDirection="row"
justifyContent="center"
paddingX={3}
marginTop={3}
marginTop={1}
>
<Button handleClick={handleBack}>
<Button handleClick={handleSave}>
<Text $color="">{formatMessage({ id: "action.save" })}</Text>
</Button>
</Flex>
) : (
<></>
)}
</Box>
</>
);
}
57 changes: 28 additions & 29 deletions src/screens/signin/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,24 +48,31 @@ export function Signin(props: ISignin): JSX.Element {
<SettingIcon size={6} />
</IconButton>
</Flex>
{props.showConfig ? (
<Config
handleBack={() => {
props.setShowConfig(false);
checkIfOnboarded();
}}
afterBootUrlUpdate={checkIfOnboarded}
afterSetUrl={props?.afterSetUrl}
/>
) : (
<SigninComponent
signinError={props?.signinError}
isLoading={props?.isLoading}
handleConnect={props.handleConnect}
logo={props.logo}
/>
)}
<Box fontSize={0} padding={2} bottom={2}>
<Box>
{props.showConfig ? (
<Config
handleBack={() => {
props.setShowConfig(false);
checkIfOnboarded();
}}
afterBootUrlUpdate={checkIfOnboarded}
afterSetUrl={props?.afterSetUrl}
/>
) : (
<SigninComponent
signinError={props?.signinError}
isLoading={props?.isLoading}
handleConnect={props.handleConnect}
logo={props.logo}
/>
)}
</Box>
<Flex
width="100%"
justifyContent="center"
flexDirection="column"
bottom="4px"
>
{hasAgentAndBootUrls ? (
<Box textAlign="center">
<NewButton onClick={props.handleSignup} $hoverUnderline>
Expand All @@ -92,17 +99,9 @@ export function Signin(props: ISignin): JSX.Element {
{formatMessage({ id: "account.support" })}
</NewButton>
</Box>
</Box>
<Flex
width="100%"
justifyContent="center"
flexDirection="row"
position="absolute"
bottom="4px"
>
<Text $color="bodyColor">
Version: {manifest.version}
</Text>
<Box textAlign="center">
<Text $color="bodyColor">Version: {manifest.version}</Text>
</Box>
</Flex>
</Grid>
);
Expand Down