npm - feeds-fun - Versions diffs - 0.0.4 - Mend

feeds-fun 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (68) hide show

package/.eslintrc.cjs +15 -0
package/.prettierrc.json +13 -0
package/.vscode/extensions.json +3 -0
package/README.md +52 -0
package/env.d.ts +1 -0
package/index.html +13 -0
package/package.json +50 -0
package/public/favicon.ico +0 -0
package/src/App.vue +33 -0
package/src/components/ConfigFlag.vue +22 -0
package/src/components/ConfigSelector.vue +25 -0
package/src/components/DiscoveryForm.vue +81 -0
package/src/components/EntriesList.vue +51 -0
package/src/components/EntryForList.vue +156 -0
package/src/components/EntryInfo.vue +23 -0
package/src/components/FeedForList.vue +115 -0
package/src/components/FeedInfo.vue +35 -0
package/src/components/FeedsCollections.vue +53 -0
package/src/components/FeedsList.vue +27 -0
package/src/components/FfunGithubButtons.vue +22 -0
package/src/components/FfunTag.vue +95 -0
package/src/components/OPMLUpload.vue +46 -0
package/src/components/OpenaiTokensUsage.vue +61 -0
package/src/components/RuleConstructor.vue +56 -0
package/src/components/RuleScoreUpdater.vue +33 -0
package/src/components/RulesList.vue +52 -0
package/src/components/SimplePagination.vue +81 -0
package/src/components/SupertokensLogin.vue +118 -0
package/src/components/TagsFilter.vue +130 -0
package/src/components/TagsFilterElement.vue +89 -0
package/src/components/TagsList.vue +125 -0
package/src/components/UserSetting.vue +129 -0
package/src/inputs/Marker.vue +70 -0
package/src/inputs/ScoreSelector.vue +38 -0
package/src/layouts/SidePanelLayout.vue +231 -0
package/src/layouts/WideLayout.vue +44 -0
package/src/logic/api.ts +253 -0
package/src/logic/constants.ts +8 -0
package/src/logic/enums.ts +92 -0
package/src/logic/settings.ts +37 -0
package/src/logic/timer.ts +25 -0
package/src/logic/types.ts +371 -0
package/src/logic/utils.ts +39 -0
package/src/main.ts +145 -0
package/src/router/index.ts +61 -0
package/src/stores/entries.ts +217 -0
package/src/stores/globalSettings.ts +74 -0
package/src/stores/globalState.ts +23 -0
package/src/stores/supertokens.ts +144 -0
package/src/stores/tags.ts +54 -0
package/src/values/DateTime.vue +27 -0
package/src/values/FeedId.vue +22 -0
package/src/values/Score.vue +42 -0
package/src/values/URL.vue +25 -0
package/src/views/AuthView.vue +66 -0
package/src/views/CollectionsView.vue +23 -0
package/src/views/DiscoveryView.vue +26 -0
package/src/views/FeedsView.vue +124 -0
package/src/views/MainView.vue +67 -0
package/src/views/NewsView.vue +96 -0
package/src/views/RulesView.vue +33 -0
package/src/views/SettingsView.vue +81 -0
package/tsconfig.app.json +12 -0
package/tsconfig.json +14 -0
package/tsconfig.node.json +8 -0
package/tsconfig.vitest.json +9 -0
package/vite.config.ts +26 -0
package/vitest.config.ts +15 -0

package/.eslintrc.cjs ADDED Viewed

@@ -0,0 +1,15 @@
+/* eslint-env node */
+require('@rushstack/eslint-patch/modern-module-resolution')
+module.exports = {
+  root: true,
+  'extends': [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/eslint-config-typescript',
+    '@vue/eslint-config-prettier/skip-formatting'
+  ],
+  parserOptions: {
+    ecmaVersion: 'latest'
+  }
+}

package/.prettierrc.json ADDED Viewed

@@ -0,0 +1,13 @@
+{
+  "$schema": "https://json.schemastore.org/prettierrc",
+  "semi": true,
+  "tabWidth": 2,
+  "singleQuote": false,
+  "printWidth": 119,
+  "trailingComma": "none",
+  "bracketSpacing": false,
+  "bracketSameLine": true,
+  "htmlWhitespaceSensitivity": "strict",
+  "vueIndentScriptAndStyle": true,
+  "singleAttributePerLine": true
+}

package/.vscode/extensions.json ADDED Viewed

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

package/README.md ADDED Viewed

@@ -0,0 +1,52 @@
+# site
+This template should help get you started developing with Vue 3 in Vite.
+## Recommended IDE Setup
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
+## Type Support for `.vue` Imports in TS
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
+If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
+1. Disable the built-in TypeScript Extension
+    1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
+    2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
+2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
+## Customize configuration
+See [Vite Configuration Reference](https://vitejs.dev/config/).
+## Project Setup
+```sh
+npm install
+```
+### Compile and Hot-Reload for Development
+```sh
+npm run dev
+```
+### Type-Check, Compile and Minify for Production
+```sh
+npm run build
+```
+### Run Unit Tests with [Vitest](https://vitest.dev/)
+```sh
+npm run test:unit
+```
+### Lint with [ESLint](https://eslint.org/)
+```sh
+npm run lint
+```

package/env.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ /// <reference types="vite/client" />

package/index.html ADDED Viewed

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <link rel="icon" href="/favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Feeds Fun</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package/package.json ADDED Viewed

@@ -0,0 +1,50 @@
+{
+  "name": "feeds-fun",
+  "version": "0.0.4",
+  "private": false,
+  "scripts": {
+    "dev": "vite",
+    "build": "run-p type-check build-only",
+    "preview": "vite preview",
+    "test:unit": "vitest",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "format": "prettier --write src/",
+    "format-check": "prettier --check src/"
+  },
+  "dependencies": {
+    "@chenfengyuan/vue-countdown": "^2.1.1",
+    "@sentry/vue": "^7.54.0",
+    "@vueuse/core": "^9.13.0",
+    "axios": "^1.3.4",
+    "dompurify": "^3.0.1",
+    "pinia": "^2.0.32",
+    "set-interval-async": "^3.0.3",
+    "supertokens-web-js": "^0.5.0",
+    "vue": "^3.2.47",
+    "vue-github-button": "^3.1.0",
+    "vue-router": "^4.1.6"
+  },
+  "devDependencies": {
+    "@rushstack/eslint-patch": "^1.2.0",
+    "@types/dompurify": "^3.0.2",
+    "@types/jsdom": "^21.1.0",
+    "@types/lodash": "^4.14.196",
+    "@types/node": "^18.14.2",
+    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue/eslint-config-prettier": "^7.1.0",
+    "@vue/eslint-config-typescript": "^11.0.2",
+    "@vue/test-utils": "^2.3.0",
+    "@vue/tsconfig": "^0.1.3",
+    "eslint": "^8.34.0",
+    "eslint-plugin-vue": "^9.9.0",
+    "jsdom": "^21.1.0",
+    "npm-run-all": "^4.1.5",
+    "prettier": "^2.8.4",
+    "typescript": "~4.8.4",
+    "vite": "^4.1.4",
+    "vitest": "^0.29.1",
+    "vue-tsc": "^1.2.0"
+  }
+}

package/public/favicon.ico ADDED Viewed

Binary file

package/src/App.vue ADDED Viewed

@@ -0,0 +1,33 @@
+<template>
+  <router-view />
+</template>
+<script setup lang="ts"></script>
+<style scoped>
+  .container {
+    display: flex;
+  }
+  .nav-panel {
+    width: 10rem;
+    flex-shrink: 0;
+    background-color: #f0f0f0;
+    padding: 1rem;
+  }
+  .main-content {
+    flex-grow: 1;
+    padding: 1rem;
+  }
+  .config-menu {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+  }
+  .config-menu-item {
+    margin-bottom: 1rem;
+  }
+</style>

package/src/components/ConfigFlag.vue ADDED Viewed

@@ -0,0 +1,22 @@
+<template>
+  <a
+    v-if="flag"
+    href="#"
+    @click="emit('update:flag', false)"
+    >{{ onText }}</a
+  >
+  <a
+    v-if="!flag"
+    href="#"
+    @click="emit('update:flag', true)"
+    >{{ offText }}</a
+  >
+</template>
+<script setup lang="ts">
+  defineProps<{flag: boolean; onText: string; offText: string}>();
+  const emit = defineEmits(["update:flag"]);
+</script>
+<style scoped></style>

package/src/components/ConfigSelector.vue ADDED Viewed

@@ -0,0 +1,25 @@
+<template>
+  <select @change="updateProperty($event)">
+    <option
+      v-for="[value, props] of values"
+      :value="value"
+      :selected="value === property">
+      {{ props.text }}
+    </option>
+  </select>
+</template>
+<script lang="ts" setup>
+  import * as e from "@/logic/enums";
+  const properties = defineProps<{values: any; property: string}>();
+  const emit = defineEmits(["update:property"]);
+  function updateProperty(event: Event) {
+    const target = event.target as HTMLSelectElement;
+    emit("update:property", target.value);
+  }
+</script>
+<style></style>

package/src/components/DiscoveryForm.vue ADDED Viewed

@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <input
+      type="text"
+      v-model="search"
+      :disabled="loading"
+      placeholder="Search for feeds" />
+    <button
+      :disabled="loading"
+      @click.prevent="searhedUrl = search">
+      Search
+    </button>
+    <hr />
+    <div v-if="!loading && foundFeeds.length === 0">No feeds found</div>
+    <div v-else-if="loading">Searching for feeds…</div>
+    <div v-else>
+      <div
+        v-for="feed in foundFeeds"
+        :key="feed.url">
+        <feed-info :feed="feed" />
+        <button
+          v-if="!addedFeeds[feed.url]"
+          @click.prevent="addFeed(feed.url)">
+          Add
+        </button>
+        <p v-else>Feed added</p>
+        <hr />
+      </div>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+  import {computed, ref} from "vue";
+  import type * as t from "@/logic/types";
+  import * as e from "@/logic/enums";
+  import * as api from "@/logic/api";
+  import {computedAsync} from "@vueuse/core";
+  import {useEntriesStore} from "@/stores/entries";
+  const search = ref("");
+  const loading = ref(false);
+  const searhedUrl = ref("");
+  const addedFeeds = ref<{[key: string]: boolean}>({});
+  const foundFeeds = computedAsync(async () => {
+    if (searhedUrl.value === "") {
+      return [];
+    }
+    loading.value = true;
+    let feeds: t.FeedInfo[] = [];
+    try {
+      feeds = await api.discoverFeeds({url: searhedUrl.value});
+    } catch (e) {
+      console.error(e);
+    }
+    loading.value = false;
+    return feeds;
+  }, []);
+  async function addFeed(url: string) {
+    addedFeeds.value[url] = true;
+    await api.addFeed({url: url});
+  }
+</script>
+<style scoped></style>

package/src/components/EntriesList.vue ADDED Viewed

@@ -0,0 +1,51 @@
+<template>
+  <div>
+    <template v-if="entriesToShow.length > 0">
+      <ul style="list-style-type: none; margin: 0; padding: 0">
+        <li
+          v-for="entryId in entriesToShow"
+          :key="entryId"
+          style="margin-bottom: 0.25rem">
+          <entry-for-list
+            :entryId="entryId"
+            :time-field="timeField"
+            :show-tags="showTags" />
+        </li>
+      </ul>
+      <hr />
+      <simple-pagination
+        :showFromStart="showFromStart"
+        :showPerPage="showPerPage"
+        :total="entriesIds.length"
+        :counterOnNewLine="false"
+        v-model:showEntries="showEntries" />
+    </template>
+  </div>
+</template>
+<script lang="ts" setup>
+  import {computed, ref} from "vue";
+  import type * as t from "@/logic/types";
+  import {computedAsync} from "@vueuse/core";
+  const properties = defineProps<{
+    entriesIds: Array<t.EntryId>;
+    timeField: string;
+    showTags: boolean;
+    showFromStart: number;
+    showPerPage: number;
+  }>();
+  const showEntries = ref(properties.showFromStart);
+  const entriesToShow = computed(() => {
+    if (properties.entriesIds == null) {
+      return [];
+    }
+    return properties.entriesIds.slice(0, showEntries.value);
+  });
+</script>
+<style></style>

package/src/components/EntryForList.vue ADDED Viewed

@@ -0,0 +1,156 @@
+<template>
+  <div class="container">
+    <div style="flex-shrink: 0; width: 2rem; text-align: right; padding-right: 0.25rem">
+      <value-score
+        :value="entry.score"
+        :entry-id="entry.id"
+        class="entity-for-list-score" />
+    </div>
+    <div style="flex-grow: 1">
+      <input-marker
+        :marker="e.Marker.Read"
+        :entry-id="entryId"
+        on-text="read"
+        off-text="new!" />
+      ·
+      <a
+        href="#"
+        style="text-decoration: none"
+        v-if="!showBody"
+        @click.prevent="displayBody()"
+        >&#9660;</a
+      >
+      <a
+        href="#"
+        style="text-decoration: none"
+        v-if="showBody"
+        @click.prevent="showBody = false"
+        >&#9650;</a
+      >
+      <a
+        :href="entry.url"
+        target="_blank"
+        @click="onTitleClick()"
+        rel="noopener noreferrer">
+        {{ purifiedTitle }}
+      </a>
+      <template v-if="showTags">
+        <br />
+        <tags-list :tags="entry.tags" />
+      </template>
+      <div
+        v-if="showBody"
+        style="display: flex; justify-content: center">
+        <div style="max-width: 50rem">
+          <h2>{{ purifiedTitle }}</h2>
+          <p v-if="entry.body === null">loading...</p>
+          <div
+            v-if="entry.body !== null"
+            v-html="purifiedBody" />
+        </div>
+      </div>
+    </div>
+    <div style="flex-shrink: 0; width: 1rem; left-padding: 0.25rem">
+      <value-date-time
+        :value="timeFor"
+        :reversed="true" />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+  import _ from "lodash";
+  import {computed, ref} from "vue";
+  import type * as t from "@/logic/types";
+  import * as e from "@/logic/enums";
+  import {computedAsync} from "@vueuse/core";
+  import DOMPurify from "dompurify";
+  import {useEntriesStore} from "@/stores/entries";
+  const entriesStore = useEntriesStore();
+  const properties = defineProps<{
+    entryId: t.EntryId;
+    timeField: string;
+    showTags: boolean;
+  }>();
+  const entry = computed(() => {
+    if (properties.entryId in entriesStore.entries) {
+      return entriesStore.entries[properties.entryId];
+    }
+    throw new Error(`Unknown entry: ${properties.entryId}`);
+  });
+  const showBody = ref(false);
+  const timeFor = computed(() => {
+    if (entry.value === null) {
+      return null;
+    }
+    return _.get(entry.value, properties.timeField, null);
+  });
+  function displayBody() {
+    showBody.value = true;
+    if (entry.value === null) {
+      throw new Error("entry is null");
+    }
+    entriesStore.requestFullEntry({entryId: entry.value.id});
+  }
+  const purifiedTitle = computed(() => {
+    if (entry.value === null) {
+      return "";
+    }
+    // TODO: remove emojis?
+    let title = DOMPurify.sanitize(entry.value.title, {ALLOWED_TAGS: []});
+    if (title.length === 0) {
+      title = "No title";
+    }
+    return title;
+  });
+  const purifiedBody = computed(() => {
+    if (entry.value === null) {
+      return "";
+    }
+    if (entry.value.body === null) {
+      return "";
+    }
+    return DOMPurify.sanitize(entry.value.body);
+  });
+  async function onTitleClick() {
+    await entriesStore.setMarker({
+      entryId: properties.entryId,
+      marker: e.Marker.Read
+    });
+  }
+</script>
+<style scoped>
+  .container {
+    display: flex;
+  }
+  .container :deep(img) {
+    max-width: 100%;
+    height: auto;
+  }
+</style>

package/src/components/EntryInfo.vue ADDED Viewed

@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <a
+      :href="entry.url"
+      target="_blank"
+      rel="noopener noreferrer">
+      {{ entry.title }}
+    </a>
+  </div>
+</template>
+<script lang="ts" setup>
+  import {computed, ref} from "vue";
+  import type * as t from "@/logic/types";
+  import * as e from "@/logic/enums";
+  import * as api from "@/logic/api";
+  import {computedAsync} from "@vueuse/core";
+  import {useEntriesStore} from "@/stores/entries";
+  const props = defineProps<{entry: t.EntryInfo}>();
+</script>
+<style scoped></style>

package/src/components/FeedForList.vue ADDED Viewed

@@ -0,0 +1,115 @@
+<template>
+  <div
+    v-if="feed !== null"
+    class="container">
+    <div style="flex-shrink: 0; width: 4rem; left-padding: 0.25rem">
+      <a
+        href="#"
+        @click.prevent="unsubscribe()">
+        remove
+      </a>
+    </div>
+    <div
+      style="flex-shrink: 0; width: 3rem; left-padding: 0.25rem; cursor: default"
+      title="Time of last load">
+      <value-date-time
+        :value="feed.loadedAt"
+        :reversed="true" />
+    </div>
+    <div
+      style="flex-shrink: 0; width: 3rem; left-padding: 0.25rem; cursor: default"
+      title="When was added">
+      <value-date-time
+        :value="feed.linkedAt"
+        :reversed="true" />
+    </div>
+    <div style="flex-shrink: 0; width: 2rem; text-align: right; padding-right: 0.25rem">
+      <span
+        v-if="feed.isOk"
+        title="everything is ok"
+        class="state-ok"
+        >ok</span
+      >
+      <span
+        v-else
+        :title="feed.lastError || 'unknown error'"
+        class="state-error"
+        >⚠</span
+      >
+    </div>
+    <div style="flex-grow: 1">
+      <value-url
+        :value="feed.url"
+        :text="purifiedTitle" />
+      <template v-if="globalSettings.showFeedsDescriptions">
+        <br />
+        <div v-html="purifiedDescription" />
+      </template>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+  import {computed, ref} from "vue";
+  import type * as t from "@/logic/types";
+  import * as e from "@/logic/enums";
+  import * as api from "@/logic/api";
+  import {computedAsync} from "@vueuse/core";
+  import DOMPurify from "dompurify";
+  import {useGlobalSettingsStore} from "@/stores/globalSettings";
+  const globalSettings = useGlobalSettingsStore();
+  const properties = defineProps<{feed: t.Feed}>();
+  const purifiedTitle = computed(() => {
+    if (properties.feed.title === null) {
+      return "";
+    }
+    let title = DOMPurify.sanitize(properties.feed.title, {ALLOWED_TAGS: []});
+    if (title.length === 0) {
+      return null;
+    }
+    return title;
+  });
+  const purifiedDescription = computed(() => {
+    if (properties.feed.description === null) {
+      return "";
+    }
+    return DOMPurify.sanitize(properties.feed.description);
+  });
+  async function unsubscribe() {
+    await api.unsubscribe({feedId: properties.feed.id});
+    globalSettings.updateDataVersion();
+  }
+</script>
+<style scoped>
+  .container {
+    display: flex;
+  }
+  .container :deep(img) {
+    max-width: 100%;
+    height: auto;
+  }
+  .state-ok {
+    color: green;
+    cursor: default;
+  }
+  .state-error {
+    color: red;
+    cursor: default;
+  }
+</style>