Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@IchthysMaranathaCopy
IchthysMaranathaCopy authored Mar 13, 2024
1 parent cefb946 commit 59fa10e
Showing 1 changed file with 184 additions and 184 deletions.
368 changes: 184 additions & 184 deletions packages/builder/src/pages/builder/auth/login.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,184 +1,184 @@
<script>
import {
ActionButton,
Body,
Button,
Divider,
Heading,
Layout,
notifications,
Link,
} from "@budibase/bbui"
import { goto } from "@roxi/routify"
import { auth, organisation, oidc, admin } from "stores/portal"
import GoogleButton from "./_components/GoogleButton.svelte"
import OIDCButton from "./_components/OIDCButton.svelte"
import { handleError } from "./_components/utils"
import Logo from "assets/bb-emblem.svg"
import { TestimonialPage } from "@budibase/frontend-core/src/components"
import { FancyForm, FancyInput } from "@budibase/bbui"
import { onMount } from "svelte"
let loaded = false
let form
let errors = {}
let formData = {}
$: company = $organisation.company || "Budibase"
$: cloud = $admin.cloud
if ($organisation.isSSOEnforced) {
await organisation.init().oidc.init()
if (organisation.oidc) {
const url = `/api/global/auth/${$auth.tenantId}/oidc/configs/${$oidc.uuid}`
window.location = url
}
}
async function login() {
form.validate()
if (Object.keys(errors).length > 0) {
console.log("errors", errors)
return
}
try {
await auth.login({
username: formData?.username.trim(),
password: formData?.password,
})
if ($auth?.user?.forceResetPassword) {
$goto("./reset")
} else {
notifications.success("Logged in successfully")
$goto("../portal")
}
} catch (err) {
notifications.error(err.message ? err.message : "Invalid credentials")
}
}
function handleKeydown(evt) {
if (evt.key === "Enter") login()
}
onMount(async () => {
try {
await organisation.init()
} catch (error) {
notifications.error("Error getting org config")
}
loaded = true
})
</script>
<svelte:window on:keydown={handleKeydown} />
{#if loaded}
<TestimonialPage enabled={$organisation.testimonialsEnabled}>
<Layout gap="L" noPadding>
<Layout justifyItems="center" noPadding>
{#if loaded}
<img alt="logo" src={$organisation.logoUrl || Logo} />
{/if}
<Heading size="M">
{$organisation.loginHeading || "Log in to Budibase"}
</Heading>
</Layout>
<Layout gap="S" noPadding>
{#if loaded && ($organisation.google || $organisation.oidc)}
<FancyForm>
<OIDCButton oidcIcon={$oidc.logo} oidcName={$oidc.name} samePage />
<GoogleButton samePage />
</FancyForm>
{/if}
{#if !$organisation.isSSOEnforced}
<Divider />
<FancyForm bind:this={form}>
<FancyInput
label="Your work email"
value={formData.username}
on:change={e => {
formData = {
...formData,
username: e.detail,
}
}}
validate={() => {
let fieldError = {
username: !formData.username
? "Please enter a valid email"
: undefined,
}
errors = handleError({ ...errors, ...fieldError })
}}
error={errors.username}
/>
<FancyInput
label="Password"
value={formData.password}
type="password"
on:change={e => {
formData = {
...formData,
password: e.detail,
}
}}
validate={() => {
let fieldError = {
password: !formData.password
? "Please enter your password"
: undefined,
}
errors = handleError({ ...errors, ...fieldError })
}}
error={errors.password}
/>
</FancyForm>
{/if}
</Layout>
{#if !$organisation.isSSOEnforced}
<Layout gap="XS" noPadding justifyItems="center">
<Button
size="L"
cta
disabled={Object.keys(errors).length > 0}
on:click={login}
>
{$organisation.loginButton || `Log in to ${company}`}
</Button>
</Layout>
<Layout gap="XS" noPadding justifyItems="center">
<div class="user-actions">
<ActionButton size="L" quiet on:click={() => $goto("./forgot")}>
Forgot password?
</ActionButton>
</div>
</Layout>
{/if}
{#if cloud}
<Body size="xs" textAlign="center">
By using Budibase Cloud
<br />
you are agreeing to our
<Link
href="https://budibase.com/eula"
target="_blank"
secondary={true}
>
License Agreement
</Link>
</Body>
{/if}
</Layout>
</TestimonialPage>
{/if}
<style>
.user-actions {
display: flex;
align-items: center;
}
img {
width: 48px;
}
</style>
<script>
import {
ActionButton,
Body,
Button,
Divider,
Heading,
Layout,
notifications,
Link,
} from "@budibase/bbui"
import { goto } from "@roxi/routify"
import { auth, organisation, oidc, admin } from "stores/portal"
import GoogleButton from "./_components/GoogleButton.svelte"
import OIDCButton from "./_components/OIDCButton.svelte"
import { handleError } from "./_components/utils"
import Logo from "assets/bb-emblem.svg"
import { TestimonialPage } from "@budibase/frontend-core/src/components"
import { FancyForm, FancyInput } from "@budibase/bbui"
import { onMount } from "svelte"
let loaded = false
let form
let errors = {}
let formData = {}
$: company = $organisation.company || "Budibase"
$: cloud = $admin.cloud
if ($organisation.isSSOEnforced) {
organisation.init().oidc.init()
if (organisation.oidc) {
const url = `/api/global/auth/${$auth.tenantId}/oidc/configs/${$oidc.uuid}`
window.location = url
}
}
async function login() {
form.validate()
if (Object.keys(errors).length > 0) {
console.log("errors", errors)
return
}
try {
await auth.login({
username: formData?.username.trim(),
password: formData?.password,
})
if ($auth?.user?.forceResetPassword) {
$goto("./reset")
} else {
notifications.success("Logged in successfully")
$goto("../portal")
}
} catch (err) {
notifications.error(err.message ? err.message : "Invalid credentials")
}
}
function handleKeydown(evt) {
if (evt.key === "Enter") login()
}
onMount(async () => {
try {
await organisation.init()
} catch (error) {
notifications.error("Error getting org config")
}
loaded = true
})
</script>
<svelte:window on:keydown={handleKeydown} />
{#if loaded}
<TestimonialPage enabled={$organisation.testimonialsEnabled}>
<Layout gap="L" noPadding>
<Layout justifyItems="center" noPadding>
{#if loaded}
<img alt="logo" src={$organisation.logoUrl || Logo} />
{/if}
<Heading size="M">
{$organisation.loginHeading || "Log in to Budibase"}
</Heading>
</Layout>
<Layout gap="S" noPadding>
{#if loaded && ($organisation.google || $organisation.oidc)}
<FancyForm>
<OIDCButton oidcIcon={$oidc.logo} oidcName={$oidc.name} samePage />
<GoogleButton samePage />
</FancyForm>
{/if}
{#if !$organisation.isSSOEnforced}
<Divider />
<FancyForm bind:this={form}>
<FancyInput
label="Your work email"
value={formData.username}
on:change={e => {
formData = {
...formData,
username: e.detail,
}
}}
validate={() => {
let fieldError = {
username: !formData.username
? "Please enter a valid email"
: undefined,
}
errors = handleError({ ...errors, ...fieldError })
}}
error={errors.username}
/>
<FancyInput
label="Password"
value={formData.password}
type="password"
on:change={e => {
formData = {
...formData,
password: e.detail,
}
}}
validate={() => {
let fieldError = {
password: !formData.password
? "Please enter your password"
: undefined,
}
errors = handleError({ ...errors, ...fieldError })
}}
error={errors.password}
/>
</FancyForm>
{/if}
</Layout>
{#if !$organisation.isSSOEnforced}
<Layout gap="XS" noPadding justifyItems="center">
<Button
size="L"
cta
disabled={Object.keys(errors).length > 0}
on:click={login}
>
{$organisation.loginButton || `Log in to ${company}`}
</Button>
</Layout>
<Layout gap="XS" noPadding justifyItems="center">
<div class="user-actions">
<ActionButton size="L" quiet on:click={() => $goto("./forgot")}>
Forgot password?
</ActionButton>
</div>
</Layout>
{/if}
{#if cloud}
<Body size="xs" textAlign="center">
By using Budibase Cloud
<br />
you are agreeing to our
<Link
href="https://budibase.com/eula"
target="_blank"
secondary={true}
>
License Agreement
</Link>
</Body>
{/if}
</Layout>
</TestimonialPage>
{/if}
<style>
.user-actions {
display: flex;
align-items: center;
}
img {
width: 48px;
}
</style>

0 comments on commit 59fa10e

Please sign in to comment.