stufflog/svelte-ui/src/modals/RemovePeriodLogModal.svelte

<script>
  import pluralize from "pluralize";
  import ModalFrame from "../components/ModalFrame";

  import modal from "../stores/modal";
  import stufflog from "../stores/stufflog";

  import dateStr from "../utils/dateStr";

  export let period = {};
  export let log = {};
  export let activity = {};

let error = null;

  function removePeriodLog() {
    stufflog.updatePeriod(period.id, {removeLog: log.id}).then(() => {
      modal.close();
    }).catch(err => {
      error = err.message || err;
      console.warn(err);
    });
  }
</script>

<ModalFrame title={`Remove ${period.name} Log`} error={error} closable on:close={() => modal.close()}>
  <form on:submit|preventDefault={() => removePeriodLog()}>
    <p>
      Are you sure you want to remove log <b>{log.description}</b> 
      (<b>{dateStr(log.date)}</b>, <b>{activity.name}</b>) from 
      period <b>{period.name}</b>?
    </p>

    <hr />

    <button type="submit">Yes, do as I say</button>
  </form>
</ModalFrame>