improvement: disable input when request is pending
This commit is contained in:
parent
06c8a217e0
commit
7c831b76e2
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import Input from './Input.svelte'
|
||||
import InputContainer from './InputContainer.svelte'
|
||||
import EventList from './EventList.svelte'
|
||||
import Status from './Status.svelte'
|
||||
import TrackingPanel from './TrackingPanel.svelte'
|
||||
|
@ -14,8 +14,7 @@
|
|||
<TrackingPanel />
|
||||
{/if}
|
||||
|
||||
<Status />
|
||||
<Input />
|
||||
<InputContainer />
|
||||
{#if showEventList}
|
||||
<EventList />
|
||||
{/if}
|
||||
|
|
|
@ -19,6 +19,9 @@
|
|||
import { createEvent } from '../actions'
|
||||
import logger from '../services/logger'
|
||||
|
||||
export let error
|
||||
export let pending
|
||||
|
||||
let value
|
||||
|
||||
const onChange = (e) => {
|
||||
|
@ -38,6 +41,7 @@
|
|||
id="url"
|
||||
name="url"
|
||||
bind:value={value}
|
||||
disabled={pending}
|
||||
placeholder="Paste / type FB event URL or event number..."
|
||||
title="Please insert Facebook Event URL / Number"
|
||||
/>
|
||||
|
@ -45,6 +49,7 @@
|
|||
id="submit"
|
||||
type='submit'
|
||||
value='Submit'
|
||||
disabled={pending}
|
||||
on:click={handleSubmit}
|
||||
/>
|
||||
</form>
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
<script>
|
||||
import { parseStatusStore, requestStore, swStatusStore } from '../stores'
|
||||
import Input from './Input.svelte'
|
||||
import Status from './Status.svelte'
|
||||
|
||||
$: error = ($requestStore && $requestStore.error) ? $requestStore.error : null
|
||||
$: pending = Boolean($requestStore && !$requestStore.error)
|
||||
$: pendingRequest = $requestStore
|
||||
$: status = $parseStatusStore
|
||||
$: swStatus = $swStatusStore
|
||||
</script>
|
||||
|
||||
<div class="input-container">
|
||||
<Input
|
||||
{pending}
|
||||
{error}
|
||||
/>
|
||||
<Status
|
||||
{error}
|
||||
{pending}
|
||||
{pendingRequest}
|
||||
{status}
|
||||
{swStatus}
|
||||
/>
|
||||
</div>
|
|
@ -14,31 +14,32 @@
|
|||
</style>
|
||||
|
||||
<script>
|
||||
import { parseStatusStore, requestStore, swStatusStore } from '../stores'
|
||||
|
||||
$: error = ($requestStore && $requestStore.error) ? $requestStore.error : null
|
||||
$: pendingRequest = Boolean($requestStore && !$requestStore.error)
|
||||
export let error
|
||||
export let pending
|
||||
export let pendingRequest
|
||||
export let status
|
||||
export let swStatus
|
||||
</script>
|
||||
|
||||
<div id='status'>
|
||||
{#if error}
|
||||
<div class='status-item'>
|
||||
<div class='status-item status-item--error'>
|
||||
{error.toString()}
|
||||
</div>
|
||||
{/if}
|
||||
{#if pendingRequest}
|
||||
{#if pending && pendingRequest}
|
||||
<div class='status-item'>
|
||||
Fetching event {$requestStore.url}
|
||||
Fetching event {pendingRequest.url}
|
||||
</div>
|
||||
{/if}
|
||||
{#if $parseStatusStore}
|
||||
{#if status}
|
||||
<div class='status-item'>
|
||||
{$parseStatusStore}
|
||||
{status}
|
||||
</div>
|
||||
{/if}
|
||||
{#if $swStatusStore}
|
||||
{#if swStatus}
|
||||
<div class='status-item'>
|
||||
{$swStatusStore}
|
||||
{swStatus}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue