rihanarfan / bereal-web Goto Github PK

Support opening BeReal profiles URLs like https://bere.al/exampleuser in the PWA and shows their profile with an add friend button.

The url_handlers part of web manifest allows PWAs to register as URL handlers. https://web.dev/pwa-url-handler/

The only requirement to getting this to work is that BeReal would need to add a web-app-origin-association file to .well-known to permit the PWA to handle their URLs.

Use settings endpoint's polling.friendsFeed on friends feed query's stale time

Allow dragging secondary images to the opposite side

• Fix comments UI issues
• Add comments
• Delete comments

Refresh feeds with pull to refresh

Prompt to install the PWA. PWA would have access to certain APIs like background syncing.

Use useHead from @unhead/vue to set the title on different pages.

Could also use useTitle from vueuse for something simpler

Being rewritten into Nuxt 3, and with a responsive desktop layout.

Populate queries with placeholders as they load.

Loading a user's profile can be sped up as it's likely partially in the cache from another request, such as friends feed.

https://vue-query-next.vercel.app/#/guides/placeholder-query-data

Shows account owner's BeReal without lazy loading and with option to set caption

Posting while on the desktop might be an issue because there isn't generally two cameras. Possible workarounds include using the webcam + screenshotting the page.

On mobile it should be straightforward to capture both cameras.

https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/widgets

Add additional skeletons for loading states

• Realmojis
• User profiles
• Friends

If on mobile, use scroll snapping and size one post per screen

Make into PWA with install button and offline support

https://developer.chrome.com/blog/shared-element-transitions-for-spas/

Research feasibility of reverse geocoding without depending on 3rd party APIs

Use view transitions between pages. https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API

Consider switching to Nuxt 3 just make the project easier to maintain.

Functions can be replaced with server routes. Only concern is that the app should run fully client side, so need to see if with { ssr: false } and server routes whether everything counts as a function use or if output only will put server routes in functions directory.

Create page for logging in

This would be a nice time to try and experiment with passkey, essentially rolling my own auth on top of BeReal's possibly making cross device easier.

• Background periodic sync
• background service worker updates
• offline caching of assets
• tanstack query offline cache for vue

• User details (top bar)
• Reactions
• Comments
• Proper secondary photo layout