fix export conflict in index.js

Author: codediodeio

README.md

@@ -436,3 +436,76 @@ Slot Props & Events:
 ```
 
 Note: Each data item in the collection contains the document data AND fields for the `id` and `ref` (DocumentReference). 
+
+### `<File>`
+
+Retrives a file from Firebase storage.
+
+Props:
+
+- *path (required)* to file in storage i.e `images/mountain.jpg`
+
+Slots: 
+
+- *default slot*  shown when file is available. 
+- *loading*  shown when waiting for response. 
+- *fallback* shown when error occurs. 
+
+
+Slot Props & Events: 
+
+- *url* url to resource
+- *ref* File Reference for direct acess
+
+```html
+<File {path} let:url let:ref>
+  
+    <img src={url} />
+
+    <div slot="loading">
+        Loading...
+    </div>
+
+    <div slot="fallback">
+        Error
+    </div>
+
+</File>
+```
+
+### `<Upload>`
+
+Props:
+
+- *path (required)* to upload to i.e "images/mountain.jpg"
+- *file* file to upload as a file object `Blob` or `Unit8Array`
+
+Slots: 
+
+- *default slot*  shown before upload is complete.
+- *complete*  shown when upload is complete.
+- *fallback* shown when error occurs or upload is cancelled.
+
+
+Slot Props & Events: 
+
+- *url* url to uploaded file.
+- *task* Firebase upload task.
+- *snapshot* snapshot of upload, useful for monitoring progress.
+
+
+```html
+<Upload {file} {path} let:task let:snapshot let:url>
+
+   Uploading your file... {snaphot.bytesTransferred}
+
+  <div slot="complete">
+    Download here {url}
+  </div>
+
+  <div slot="fallback">
+    Error or canceled
+  </div>
+
+</Upload>
+```

src/File.svelte

@@ -0,0 +1,56 @@
+<script>
+  export let path;
+  export let log = false;
+  export let traceId = "";
+  export let startWith = undefined; // Why? Firestore returns null for docs that don't exist, predictible loading state.
+  export let maxWait = 10000;
+  export let once = false;
+
+  import { onDestroy, onMount, createEventDispatcher } from "svelte";
+  import { uploadFileStore } from "./storage";
+
+  const opts = {
+    startWith,
+    traceId,
+    log,
+    maxWait,
+    once
+  }
+
+  let store = uploadFileStore(path, opts);
+
+  const dispatch = createEventDispatcher();
+
+  let unsub;
+
+  // Props changed
+  $: {
+    if (unsub) {
+      // Unsub and create new store
+      unsub();
+      store = uploadFileStore(path, opts);
+      dispatch("ref", { ref: store.ref });
+    }
+
+    unsub = store.subscribe(url => {
+      dispatch("url", {
+        url
+      });
+    });
+  }
+
+  onMount(() => dispatch("ref", { ref: store.ref }))
+  onDestroy(() => unsub());
+</script>
+
+<slot name="before" />
+
+{#if $store}
+  <slot url={$store} ref={store.ref} error={store.error} />
+{:else if store.loading}
+  <slot name="loading" />
+{:else}
+  <slot name="fallback" />
+{/if}
+
+<slot name="after" />

src/Upload.svelte

@@ -0,0 +1,56 @@
+<script>
+  export let path;
+  export let log = false;
+  export let traceId = "";
+  export let startWith = undefined; // Why? Firestore returns null for docs that don't exist, predictible loading state.
+  export let maxWait = 10000;
+  export let once = false;
+
+  import { onDestroy, onMount, createEventDispatcher } from "svelte";
+  import { fileStore } from "./storage";
+
+  const opts = {
+    startWith,
+    traceId,
+    log,
+    maxWait,
+    once
+  }
+
+  let store = fileStore(path, opts);
+
+  const dispatch = createEventDispatcher();
+
+  let unsub;
+
+  // Props changed
+  $: {
+    if (unsub) {
+      // Unsub and create new store
+      unsub();
+      store = fileStore(path, opts);
+      dispatch("ref", { ref: store.ref });
+    }
+
+    unsub = store.subscribe(url => {
+      dispatch("url", {
+        url
+      });
+    });
+  }
+
+  onMount(() => dispatch("ref", { ref: store.ref }))
+  onDestroy(() => unsub());
+</script>
+
+<slot name="before" />
+
+{#if $store}
+  <slot url={$store} ref={store.ref} error={store.error} />
+{:else if store.complete}
+  <slot name="complete" />
+{:else}
+  <slot name="fallback" />
+{/if}
+
+<slot name="after" />

src/index.js

@@ -4,6 +4,12 @@ import Doc from './Doc.svelte';
 import Collection from './Collection.svelte';
 import { userStore } from './auth';
 import { docStore, collectionStore } from './firestore';
+<<<<<<< HEAD
+=======
+import { fileStore, uploadFileStore } from './storage';
+import File from './File.svelte';
+import Upload from './Upload.svelte';
+>>>>>>> cff7a90ef6de662946e8fe2d34d89991af243890
 
 
 export {
@@ -14,4 +20,11 @@ export {
     userStore,
     docStore,
     collectionStore,
+<<<<<<< HEAD
+=======
+    fileStore,
+    uploadFileStore,
+    File,
+    Upload,
+>>>>>>> cff7a90ef6de662946e8fe2d34d89991af243890
 }

src/storage.js

@@ -0,0 +1,145 @@
+import { writable } from 'svelte/store';
+import { assertApp } from './helpers';
+import { startTrace, stopTrace } from './perf';
+
+// Svelte Store for Storage file
+export function fileStore(path, opts) {
+  const storage = assertApp('storage');
+
+  const { startWith, log, traceId, maxWait, once } = { maxWait: 10000, ...opts };
+
+  const storageRef = storage.ref();
+  const ref = typeof path === 'string' ? storageRef.child(path) : path;
+
+  // Performance trace
+  const trace = traceId && startTrace(traceId);
+
+  // Internal state
+  let _loading = typeof startWith !== undefined;
+  let _error = null;
+  let _teardown;
+  let _waitForIt;
+
+  // State should never change without emitting a new value
+  // Clears loading state on first call
+  const next = (val, err) => {
+    _loading = false; 
+    _waitForIt && clearTimeout(_waitForIt);
+    _error = err || null;
+    set(val);
+    trace && stopTrace(trace);
+  };
+
+  // Timout
+  // Runs of first subscription
+  const start = () => {
+
+    // Timout for fallback slot
+    _waitForIt = maxWait && setTimeout(() => _loading && next(null, new Error(`Timeout at ${maxWait}. Using fallback slot.`) ), maxWait)
+
+    // Realtime firebase subscription
+    _teardown = ref.on("value",
+      snapshot => {
+        // Emit next value
+        snapshot.getDownloadURL().then((url) => {
+          next(url);
+          if (log) console.log(`URl: ${url}`);
+        });
+
+        
+        if (log) console.log('Snapshot:', snapshot);
+
+        // Teardown after first emitted value if once
+        once && _teardown();
+      },
+
+      // Handle firebase thrown errors
+      error => {
+        console.error(error);
+        next(null, error);
+      }
+    );
+
+    // Removes firebase listener when store completes
+    return () => _teardown();
+  };
+
+  // Svelte store
+  const store = writable(startWith, start);
+  const { subscribe, set } = store;
+
+  return {
+    subscribe,
+    firestore,
+    ref,
+    get loading() {
+      return _loading;
+    },
+    get error() {
+      return _error;
+    }
+  };
+}
+
+export function uploadFileStore(path, opts) {
+  const storage = assertApp('storage');
+
+  const { startWith, log, traceId } = { maxWait: 10000, ...opts };
+
+  const storageRef = storage.ref();
+  const ref = typeof path === 'string' ? storageRef.child(path) : path;
+  let snapshot;
+  let task;
+
+  // Performance trace
+  const trace = traceId && startTrace(traceId);
+
+  // Internal state
+  let _loading = typeof startWith !== undefined;
+  let _error = null;
+  let _waitForIt;
+
+  // State should never change without emitting a new value
+  // Clears loading state on first call
+  const next = (val, err) => {
+    _loading = false; 
+    _waitForIt && clearTimeout(_waitForIt);
+    _error = err || null;
+    set(val);
+    trace && stopTrace(trace);
+  };
+
+  // Timout
+  // Runs of first subscription
+  const start = () => {};
+
+  // Svelte store
+  const store = writable(startWith, start);
+  let { subscribe, set } = store;
+
+  const _set = set;
+  set = (val) => {
+    task = ref.put(val).then(snap => {
+      snapshot = snap;
+      ref.getDownloadURL().then((url) => {
+        next(url);
+        if (log) console.log(`URl: ${url}`);
+      });
+    });
+    task.on('state_changed', snap => {
+      snapshot = snap;
+    });
+  }
+
+  return {
+    subscribe,
+    firestore,
+    ref,
+    get loading() {
+      return _loading;
+    },
+    get error() {
+      return _error;
+    }
+  };
+}