-
Notifications
You must be signed in to change notification settings - Fork 158
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
8fa7408
commit 30f06ab
Showing
13 changed files
with
639 additions
and
84 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
175 changes: 120 additions & 55 deletions
175
src/routes/console/project-[project]/messaging/providers/create.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,68 +1,133 @@ | ||
<script lang="ts"> | ||
import { Submit, trackEvent, trackError } from '$lib/actions/analytics'; | ||
import { Modal, CustomId } from '$lib/components'; | ||
import { Pill } from '$lib/elements'; | ||
import { InputText, Button, FormList } from '$lib/elements/forms'; | ||
import { addNotification } from '$lib/stores/notifications'; | ||
import { onDestroy } from 'svelte'; | ||
import { Wizard } from '$lib/layout'; | ||
import type { WizardStepsType } from '$lib/layout/wizard.svelte'; | ||
import Step1 from './wizard/step1.svelte'; | ||
import Step2 from './wizard/step2.svelte'; | ||
import Step3 from './wizard/step3.svelte'; | ||
import Step4 from './wizard/step4.svelte'; | ||
import { sdk } from '$lib/stores/sdk'; | ||
import { Submit, trackError, trackEvent } from '$lib/actions/analytics'; | ||
import { addNotification } from '$lib/stores/notifications'; | ||
import { goto } from '$app/navigation'; | ||
import { base } from '$app/paths'; | ||
import { project } from '../../store'; | ||
import { wizard } from '$lib/stores/wizard'; | ||
import { provider, providerParams } from './wizard/store'; | ||
import { ID } from '@appwrite.io/console'; | ||
import { createEventDispatcher } from 'svelte'; | ||
export let showCreate = false; | ||
const dispatch = createEventDispatcher(); | ||
let name: string, id: string, error: string; | ||
let showCustomId = false; | ||
const create = async () => { | ||
async function create() { | ||
try { | ||
const team = await sdk.forProject.teams.create(id ?? ID.unique(), name); | ||
name = ''; | ||
showCreate = false; | ||
showCustomId = false; | ||
let response = { $id: '', name: '' }; | ||
const providerId = $providerParams[$provider].providerId || ID.unique(); | ||
switch ($provider) { | ||
case 'twilio': | ||
response = await sdk.forProject.client.call( | ||
'POST', | ||
new URL( | ||
sdk.forProject.client.config.endpoint + '/messaging/providers/twilio' | ||
), | ||
{ | ||
'X-Appwrite-Project': sdk.forProject.client.config.project, | ||
'content-type': 'application/json', | ||
'X-Appwrite-Mode': 'admin' | ||
}, | ||
{ | ||
providerId: providerId, | ||
name: $providerParams[$provider].name, | ||
default: $providerParams[$provider].default, | ||
enabled: $providerParams[$provider].enabled, | ||
accountSid: '', | ||
authToken: '' | ||
} | ||
); | ||
break; | ||
case 'mailgun': | ||
response = await sdk.forProject.client.call( | ||
'POST', | ||
new URL( | ||
sdk.forProject.client.config.endpoint + '/messaging/providers/mailgun' | ||
), | ||
{ | ||
'X-Appwrite-Project': sdk.forProject.client.config.project, | ||
'content-type': 'application/json', | ||
'X-Appwrite-Mode': 'admin' | ||
}, | ||
{ | ||
providerId: providerId, | ||
name: $providerParams[$provider].name, | ||
default: $providerParams[$provider].default, | ||
enabled: $providerParams[$provider].enabled, | ||
isEuRegion: $providerParams[$provider].isEuRegion, | ||
from: $providerParams[$provider].from, | ||
apiKey: $providerParams[$provider].apiKey, | ||
domain: $providerParams[$provider].domain | ||
} | ||
); | ||
break; | ||
case 'fcm': | ||
response = await sdk.forProject.client.call( | ||
'POST', | ||
new URL( | ||
sdk.forProject.client.config.endpoint + '/messaging/providers/mailgun' | ||
), | ||
{ | ||
'X-Appwrite-Project': sdk.forProject.client.config.project, | ||
'content-type': 'application/json', | ||
'X-Appwrite-Mode': 'admin' | ||
}, | ||
{ | ||
providerId: providerId, | ||
name: $providerParams[$provider].name, | ||
default: $providerParams[$provider].default, | ||
enabled: $providerParams[$provider].enabled, | ||
serverKey: '' | ||
} | ||
); | ||
break; | ||
} | ||
wizard.hide(); | ||
addNotification({ | ||
type: 'success', | ||
message: `${team.name} has been created` | ||
message: `${response.name} has been created` | ||
}); | ||
trackEvent(Submit.TeamCreate, { | ||
customId: !!id | ||
trackEvent(Submit.MessagingProviderCreate); | ||
await goto( | ||
`${base}/console/project-${$project.$id}/messaging/providers/provider-${response.$id}` | ||
); | ||
} catch (error) { | ||
addNotification({ | ||
type: 'error', | ||
message: error.message | ||
}); | ||
dispatch('created', team); | ||
} catch (e) { | ||
error = e.message; | ||
trackError(e, Submit.TeamCreate); | ||
trackError(error, Submit.MessagingProviderCreate); | ||
} | ||
}; | ||
$: if (!showCreate) { | ||
showCustomId = false; | ||
error = null; | ||
} | ||
onDestroy(() => { | ||
console.log('destroy'); | ||
}); | ||
const stepsComponents: WizardStepsType = new Map(); | ||
stepsComponents.set(1, { | ||
label: 'Proivder', | ||
component: Step1 | ||
}); | ||
stepsComponents.set(2, { | ||
label: 'Initialize', | ||
component: Step2 | ||
// optional: true | ||
}); | ||
stepsComponents.set(3, { | ||
label: 'Configure', | ||
component: Step3 | ||
// optional: true | ||
}); | ||
stepsComponents.set(4, { | ||
label: 'Finalize', | ||
component: Step4 | ||
// optional: true | ||
}); | ||
</script> | ||
|
||
<Modal title="Create team" {error} size="big" bind:show={showCreate} onSubmit={create}> | ||
<FormList> | ||
<InputText | ||
id="name" | ||
label="Name" | ||
placeholder="Enter name" | ||
autofocus={true} | ||
required | ||
bind:value={name} /> | ||
{#if !showCustomId} | ||
<div> | ||
<Pill button on:click={() => (showCustomId = !showCustomId)} | ||
><span class="icon-pencil" aria-hidden="true" /> | ||
<span class="text"> Team ID </span> | ||
</Pill> | ||
</div> | ||
{:else} | ||
<CustomId bind:show={showCustomId} name="Team" bind:id /> | ||
{/if} | ||
</FormList> | ||
<svelte:fragment slot="footer"> | ||
<Button secondary on:click={() => (showCreate = false)}>Cancel</Button> | ||
<Button submit>Create</Button> | ||
</svelte:fragment> | ||
</Modal> | ||
<Wizard title="Create provider" steps={stepsComponents} on:finish={create} /> |
Oops, something went wrong.