crowd-funder-for-time-pwa/src/views/HelpView.vue

<template>
  <!-- QUICK NAV -->
  <nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200 z-50">
    <ul class="flex text-2xl p-2 gap-2">
      <!-- Home Feed -->
      <li class="basis-1/5 rounded-md text-slate-500">
        <router-link :to="{ name: 'home' }" class="block text-center py-3 px-1">
          <fa icon="house-chimney" class="fa-fw"></fa>
        </router-link>
      </li>
      <!-- Search -->
      <li class="basis-1/5 rounded-md text-slate-500">
        <router-link
          :to="{ name: 'discover' }"
          class="block text-center py-3 px-1"
        >
          <fa icon="magnifying-glass" class="fa-fw"></fa>
        </router-link>
      </li>
      <!-- Projects -->
      <li class="basis-1/5 rounded-md text-slate-500">
        <router-link
          :to="{ name: 'projects' }"
          class="block text-center py-3 px-1"
        >
          <fa icon="folder-open" class="fa-fw"></fa>
        </router-link>
      </li>
      <!-- Contacts -->
      <li class="basis-1/5 rounded-md text-slate-500">
        <router-link
          :to="{ name: 'contacts' }"
          class="block text-center py-3 px-1"
        >
          <fa icon="users" class="fa-fw"></fa>
        </router-link>
      </li>
      <!-- Profile -->
      <li class="basis-1/5 rounded-md text-slate-400">
        <router-link
          :to="{ name: 'account' }"
          class="block text-center py-3 px-1"
        >
          <fa icon="circle-user" class="fa-fw"></fa>
        </router-link>
      </li>
    </ul>
  </nav>

  <!-- CONTENT -->
  <section id="Content" class="p-6 pb-24">
    <!-- Heading -->
    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
      Help
    </h1>

    <div>
      <p>
        This app is a window into data that you and your friends own, focused on
        gifts and collaboration.
      </p>

      <h2 class="text-xl font-semibold">How is this app useful?</h2>
      <p>
        We are building networks of people who want to grow a gifting society.
        First of all, you can record ways you've seen people give, and that
        leaves a permanent record... one that they show came from you. This is
        personally gratifying, but it extends to broader work: volunteers can
        get confirmation of activity and selectively show off their
        contributions and network.
      </p>
      <p>
        You can also record projects and plans and invite others to collaborate.
        Soon you'll be able to see when others are interested and see how much
        they're willing to contribute, even if there are conditions.
      </p>
      <p>
        This app uses the power of cryptography to build a reputation, recording
        activity that you can share at your discretion. You put some activity
        public, but your sensitive information is not shared with anyone,
        including our services. This is in contrast to Meta and Google, who hold
        your data and allow you use it. Those services are useful, but they have
        the control; this app gives you the control.
      </p>

      <h2 class="text-xl font-semibold">How do I backup all my data?</h2>
      <p>
        There are two parts to backup your data: the identifier secrets and the
        other data such as settings, contacts, etc.
      </p>

      <div class="px-4">
        <h2 class="text-xl font-semibold">
          How do I backup my identifier (secret) data?
        </h2>
        <ul class="list-disc list-inside">
          <li>
            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
          </li>
          <li>
            Click on "Backup Identifier Seed" and follow the instructions.
          </li>
        </ul>

        <h2 class="text-xl font-semibold">
          How do I backup my other (non-identifier-secret) data?
        </h2>
        <ul class="list-disc list-inside">
          <li>
            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
          </li>
          <li>
            Click on "Download Settings...". That will save a file to your
            downloads folder. That is your backup, so put it someplace where you
            won't lose it.
          </li>
        </ul>
      </div>

      <h2 class="text-xl font-semibold">How do I restore my data?</h2>
      <p>
        There are two parts to restore your data: the identity secrets and the
        other data such as settings, contacts, etc.
      </p>

      <div class="px-4">
        <h2 class="text-xl font-semibold">
          How do I restore my identifier (secret) data?
        </h2>
        <ul class="list-disc list-inside">
          <li>
            You only have one identifier at a time. If you have an identifier on
            Your Identity <fa icon="circle-user" class="fa-fw" /> page, you'll
            need to clear it out;
            <a
              href="https://www.lifewire.com/how-to-clear-cache-2617980"
              class="text-blue-500"
            >
              here are some helpful instructions.
            </a>
            But beware! This will also clear out your settings and contact data,
            so be sure to back that up first.
          </li>
          <li>
            <router-link class="text-blue-500" to="/">
              Go to the start
            </router-link>
            and choose "Yes" to enter the identity you backed up.
          </li>
        </ul>

        <h2 class="text-xl font-semibold">
          How do I restore my other (non-identifier-secret) data?
        </h2>
        <ul class="list-disc list-inside">
          <li>Make sure you have your backup file (above), then contact us.</li>
        </ul>
      </div>

      <h2 class="text-xl font-semibold">
        How do I add someone to my contacts?
      </h2>
      <p>
        Tell them to copy their ID, which typically starts with "did:ethr:...",
        and send it to you. Go to the Contacts
        <fa icon="circle-user" class="fa-fw" /> page and enter that into the top
        form. You may add a name by adding a comma followed by their name; you
        may also add their public key by adding another comma followed by the
        key.
      </p>

      <h2 class="text-xl font-semibold">
        How do I get permission to store claims on the server?
      </h2>
      <p>
        Get registered by someone else with the app; they can register you on
        the Contacts <fa icon="circle-user" class="fa-fw" /> page. There are
        limits to how many each person can register, so you may have to wait.
      </p>

      <h2 class="text-xl font-semibold">What do you mean by "claims"?</h2>
      <p>
        Certain actions in this app are signed by your private keys, and these
        are often called "claims". For example, when you give time to a person
        or project, you sign a claim declaring that you gave that time. When you
        declare a project, you sign a claim declaring it to the world. When you
        confirm someone else's claim, you sign a claim of agreement.
      </p>
      <p>
        Some of the data in this app does not involve claims, such as your
        contact list and your identifier.
      </p>

      <h2 class="text-xl font-semibold">
        I know there is a record from someone, so why can't I see that info?
      </h2>
      <p>
        If you don't see anything associated with a person, this is typically
        because they have not given you permission to see their information. Ask
        them to add you to their contact list and make sure the eye next to your
        name is open like this
        <fa icon="eye" class="fa-fw" /> and not closed like this
        <fa icon="eye-slash" class="fa-fw" />.
      </p>
      <p>
        Sometimes the reason you don't see something is because the search time
        is limited. Go to the bottom and make sure to load all the data on a
        list. If you still don't see it, try a search or view on a different
        page.
      </p>

      <h2 class="text-xl font-semibold">How do I create another identity?</h2>
      <p>
        Go
        <router-link to="import-account" class="text-blue-500">
          import another mnemonic here.
        </router-link>
      </p>

      <h2 class="text-xl font-semibold">What is your privacy policy?</h2>
      <p>
        See
        <a href="https://endorser.ch/privacy-policy" class="text-blue-500">
          the Endorser Service Privacy Policy.
        </a>
      </p>

      <h2 class="text-xl font-semibold">What app version is this?</h2>
      <p>
        {{ package.version }}
      </p>
    </div>
  </section>
</template>

<script lang="ts">
import * as Package from "../../package.json";
import { Component, Vue } from "vue-facing-decorator";

@Component
export default class Help extends Vue {
  package = Package;
}
</script>