Snapshot App development

Last updated by Egor Milyukov a month ago

Snapshot plugin/app development

Definitions

Grindery Snapshot App is a standalone React app, powered by Nexus workflows and hosted independently from Snapshot (Heroku, Google Cloud, etc).

Grindery Snapshot plugin is a small Vue app pushed to the Snapshot github repo.

Summary

The project consists of two parts: App and Plugin.

App is responsible for:

Receiving Snapshot space and proposal IDs from URL query

User authentication

Workflow configuration

Workflow saving/editing

Handling notifications

Plugin is responsible for:

Rendering UI to enable integration in the Snapshot interface (sidebar)

Getting specific Snapshot space id

Getting specific Snapshot proposal id

Sending user to the App to complete configuration

Optionally getting user address

User story

Click on the button in the sidebar of the Snapshot proposal screen to enable notifications. Button redirects user to the Grindery Snapshot App

Authenticate in the App

Configure notification type:

Channel (initially only browser notification, later email, telegram, etc)

Event (proposal created, deleted, started, ended, etc)

Save configured workflow

Receive notification when event happens

User redirected to the Snapshot proposal when notification clicked

Project requirements

Firebase driver (ready)

Snapshot driver with triggers to listen for proposal events (not ready)

Snapshot driver CDS (not ready)

Required developer skills

ReactJS

Vue

Github

Snapshot (optional, can be learned in process)

Browser notifications (optional, can be learned in process)

Estimated effort

Grindery Snapshot App: 8-12hrs

Grindery Snapshot plugin: 2-4hrs

Tools/documentations

Snapshot

Snapshot plugin:

Docs: https://docs.snapshot.org/plugins/create

Example plugin: https://github.com/snapshot-labs/snapshot/tree/develop/src/plugins/hal

Nexus

Nexus JS client:

Library: https://github.com/grindery-io/grindery-nexus-client

Docs: https://github.com/grindery-io/grindery-nexus-client/blob/master/DOCUMENTATION.md

Nexus Authentication React hook:

Library: https://github.com/grindery-io/use-grindery-nexus

Nexus UI React components:

Library: https://github.com/grindery-io/grindery-ui

D ocs: https://grindery-io.github.io/grindery-ui/