From 8309a68757c68481e22079609711e272810c4b56 Mon Sep 17 00:00:00 2001 From: minimo-io Date: Fri, 26 Apr 2024 13:27:30 -0300 Subject: [PATCH] Basic form validation! --- Readme.md | 6 +-- nostr-followback/README.md | 18 ++++++-- nostr-followback/src/App.svelte | 35 +++++++------- nostr-followback/src/app.css | 81 ++------------------------------- nostr-followback/vite.config.ts | 1 + 5 files changed, 39 insertions(+), 102 deletions(-) diff --git a/Readme.md b/Readme.md index 743ddfc..4c56750 100644 --- a/Readme.md +++ b/Readme.md @@ -1,10 +1,10 @@ # About appticles -A bunch of miniapps or appticles created for [minimo.io](https://minimo.io). +A bunch of mini-apps or appticles created for [minimo.io](https://minimo.io). -These micro-apps were embedded on blog posts for adding extra functionality. They were developed primarily using the Svelte Framework or Alpine.js. Most of them as proof-of-concepts. +These micro-apps were embedded on blog posts for adding extra functionality. They were developed primarily using the Svelte Framework or Alpine.js. Most of them just as proof-of-concepts and for learning purposes. -The site itself was built using [Eleventy](https://github.com/11ty/eleventy). +The site [minimo.io](https://github.com/minimo-io/minimo-11ty) itself was built using [Eleventy](https://github.com/11ty/eleventy). ## Get in touch. diff --git a/nostr-followback/README.md b/nostr-followback/README.md index 1a83964..9d27959 100644 --- a/nostr-followback/README.md +++ b/nostr-followback/README.md @@ -5,10 +5,20 @@ Let promote some reciprocity here! 😹 ## ToDo -- Remove SvelteKit (just Vite + Svelte). -- Add forms -- Polish the proof-of-concept code. -- Configure Vite for the miniapp to be loaded in the article's url as base. +- Actually load builds at minimo.io/app/ or something alike. +- Ask community for help about the bug (see below) so I can keep understanding the protocol and the library. +- Polish the proof-of-concept code, making it TS code and remove `// @ts-nocheck`! +- Create interfaces or new types instead of loose variables - Save followbackers and not followbackers in lists to see details. - Create an UI/UX that's worth looking at. +- Close connection with relays after all is checked +- Show the relay list to be used - Upload a localStorage list of relays + +- ~~Configure Vite for the miniapp to be loaded in the article's url as base.~~ +- ~~Remove SvelteKit (just Vite + Svelte).~~ + +## BUG + +- **When user follows lots of people, progress freezes:**
+ [NDK](https://github.com/nostr-dev-kit/ndk) keeps trying to re-connect to relays, and progress slows down or halts completly. Maybe slow requests down? Are they blocking the requests because they are too many too fast? diff --git a/nostr-followback/src/App.svelte b/nostr-followback/src/App.svelte index e7014c7..467870f 100644 --- a/nostr-followback/src/App.svelte +++ b/nostr-followback/src/App.svelte @@ -17,12 +17,12 @@ let unknownFollowBack = 0; let totalCountOfContactsChecked = 0; - $: progress = ((totalCountOfContactsChecked / followsCount) * 100).toFixed(); + $: progress = ((totalCountOfContactsChecked / followsCount) * 100).toFixed() | 0; let originalFollow = []; let notFollowersBack = []; - async function bootstrap() { + async function checkFollowBacks() { try { const ndk = new NDK({ explicitRelayUrls: relays, @@ -92,13 +92,14 @@ } } - //bootstrap(); + //checkFollowBacks(); -

Who does not follows you on Nostr

+

Nostr Followback

+

Let's find out who does not follow you back in Nostr!

- + { @@ -111,31 +112,29 @@ notFollowBackCount = 0; unknownFollowBack = 0; totalCountOfContactsChecked = 0; - bootstrap(); + await checkFollowBacks(); }} + disabled={!npubToQuery && progress < 100} value="Analyze" />
-{#if !querying} + {#if userThumb}
user-thumb - User: {userName} |  Follows: {followsCount} -
- {npubToQuery} -
+ User: + {userName} + |  Follows: {followsCount}
Unknown: {unknownFollowBack} | Follow_Back: {followBackCount} | - Not_Follow_Back + 👉 Not_Follow_Back : - {notFollowBackCount} - / + {notFollowersBack.length}
{#if progress < 100} @@ -180,7 +179,7 @@ -->
{:else if !querying} -

Let's find out who does not follow you back in Nostr!

+ {:else}
Loading data...
{/if} diff --git a/nostr-followback/src/app.css b/nostr-followback/src/app.css index 617f5e9..c6883d5 100644 --- a/nostr-followback/src/app.css +++ b/nostr-followback/src/app.css @@ -1,79 +1,6 @@ -:root { - font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; - line-height: 1.5; - font-weight: 400; - - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - background-color: #242424; - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - -body { - margin: 0; - display: flex; - place-items: center; - min-width: 320px; - min-height: 100vh; -} - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -.card { - padding: 2em; -} - #app { - max-width: 1280px; - margin: 0 auto; - padding: 2rem; - text-align: center; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; -} - -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } + max-width: 1280px; + margin: 0 auto; + padding: 2rem; + text-align: center; } diff --git a/nostr-followback/vite.config.ts b/nostr-followback/vite.config.ts index bf776bd..3efef73 100644 --- a/nostr-followback/vite.config.ts +++ b/nostr-followback/vite.config.ts @@ -4,4 +4,5 @@ import { svelte } from "@sveltejs/vite-plugin-svelte"; // https://vitejs.dev/config/ export default defineConfig({ plugins: [svelte()], + base: "/app/nostr-followback", });