From ac46cbdb14cb08efc7d4b367645975a66483c003 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Fri, 26 Feb 2021 09:57:06 +0000
Subject: [PATCH] Add button action for login

---
 .../EventsEditor/actions/LogIn.svelte         | 36 +++++++++++++++++++
 .../EventsEditor/actions/index.js             |  5 +++
 packages/client/src/utils/buttonActions.js    |  8 ++++-
 3 files changed, 48 insertions(+), 1 deletion(-)
 create mode 100644 packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/LogIn.svelte

diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/LogIn.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/LogIn.svelte
new file mode 100644
index 0000000000..c49369bf29
--- /dev/null
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/LogIn.svelte
@@ -0,0 +1,36 @@
+<script>
+  import { Label } from "@budibase/bbui"
+  import { getBindableProperties } from "builderStore/dataBinding"
+  import { currentAsset, store } from "builderStore"
+  import DrawerBindableInput from "components/common/DrawerBindableInput.svelte"
+
+  export let parameters
+
+  let bindingDrawer
+  $: bindings = getBindableProperties($currentAsset, $store.selectedComponentId)
+</script>
+
+<div class="root">
+  <Label small>Email</Label>
+  <DrawerBindableInput
+    title="Email"
+    value={parameters.email}
+    on:change={value => (parameters.email = value.detail)}
+    {bindings} />
+  <Label small>Password</Label>
+  <DrawerBindableInput
+    title="Password"
+    value={parameters.password}
+    on:change={value => (parameters.password = value.detail)}
+    {bindings} />
+</div>
+
+<style>
+  .root {
+    display: grid;
+    column-gap: var(--spacing-l);
+    row-gap: var(--spacing-s);
+    grid-template-columns: auto 1fr auto 1fr;
+    align-items: baseline;
+  }
+</style>
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/index.js b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/index.js
index e851bdb4be..95140f200a 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/index.js
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/index.js
@@ -4,6 +4,7 @@ import DeleteRow from "./DeleteRow.svelte"
 import ExecuteQuery from "./ExecuteQuery.svelte"
 import TriggerAutomation from "./TriggerAutomation.svelte"
 import ValidateForm from "./ValidateForm.svelte"
+import LogIn from "./LogIn.svelte"
 
 // defines what actions are available, when adding a new one
 // the component is the setup panel for the action
@@ -35,4 +36,8 @@ export default [
     name: "Validate Form",
     component: ValidateForm,
   },
+  {
+    name: "Log In",
+    component: LogIn,
+  },
 ]
diff --git a/packages/client/src/utils/buttonActions.js b/packages/client/src/utils/buttonActions.js
index cadb046514..e56960d376 100644
--- a/packages/client/src/utils/buttonActions.js
+++ b/packages/client/src/utils/buttonActions.js
@@ -1,5 +1,5 @@
 import { get } from "svelte/store"
-import { routeStore, builderStore } from "../store"
+import { routeStore, builderStore, authStore } from "../store"
 import { saveRow, deleteRow, executeQuery, triggerAutomation } from "../api"
 import { ActionTypes } from "../constants"
 
@@ -68,6 +68,11 @@ const refreshDatasourceHandler = async (action, context) => {
   )
 }
 
+const loginHandler = async action => {
+  const { email, password } = action.parameters
+  await authStore.actions.logIn({ email, password })
+}
+
 const handlerMap = {
   ["Save Row"]: saveRowHandler,
   ["Delete Row"]: deleteRowHandler,
@@ -76,6 +81,7 @@ const handlerMap = {
   ["Trigger Automation"]: triggerAutomationHandler,
   ["Validate Form"]: validateFormHandler,
   ["Refresh Datasource"]: refreshDatasourceHandler,
+  ["Log In"]: loginHandler,
 }
 
 /**