availproject / light-client-web

Avail's Web Light Client (WIP)

Avail's Light Client Site

This is an experimental light client for Avail. It runs entirely in your browser to verify that block data is available, by verifying Avail's KZG commitment proofs locally. Learn more about Avail at availproject.org

P.S. Do you want to share the awesomeness? Tweet about it and be sure to tag @AvailProject!

Contribution Guidelines

Rules

Avail welcomes contributors from anywhere and from any kind of education or skill level. We strive to create a community of developers that is welcoming, friendly and right.

1. Before asking any questions regarding how the project works, please read through all the documentation and install the project on your own local machine to try it and understand how it basically works. Please ask your questions in open channels (Github and TG).

2. Before starting to work on an issue, you need to get the approval of one of the maintainers/team members. Therefore please ask to be assigned to an issue. If you don't but you still raise a PR for that issue, your PR can be rejected. This is a form of respect for the other contributors who could have already started to work on the same problem.

3. When you ask to be assigned to an issue, it means that you are ready to work on it. When you get assigned, take the lock and then you disappear, you are not respecting the other contributors who could be able to work on that. So, after having been assigned, you have a week of time to deliver your first draft PR or reach out with any issues regrading the issue. After that time has passed without any notice, you will be unassigned.

4. If you have a new feature idea or you spot a bug you would like to fix, feel free to open up an issue with the tag [New Feature] or [Bug], someone from the team would review it and you'll get assigned to work on it.

5. Once you started working on an issue and you have some work to share and discuss with us, please raise a draft PR early with incomplete changes. This way you can continue working on the same and we can track your progress and actively review and help.

Create a pull request

Please create pull requests only for the branch develop. That code will be pushed to master only on a new release.

Also remember to pull the most recent changes available in the develop branch before submitting your PR. If your PR has merge conflicts caused by this behavior, it won’t be accepted.

Running the web-LC locally

npm i
npm run dev
# or
yarn install
yarn dev
# or
pnpm i
pnpm dev

Open http://localhost:3000 with your browser to see the result.

FIGMA

light-client-web's Issues

could not to stake by https://goldberg.avail.tools/

alltime fail

[New Feature] Light/Dark mode feature

light-client-web - [email protected] - Contributor

/home/ubuntu/light-client-web/node_modules/next/dist/lib/picocolors.js:134
const { env, stdout } = ((_globalThis = globalThis) == null ? void 0 : _globalThis.process) ?? {};
^

SyntaxError: Unexpected token '?'
at wrapSafe (internal/modules/cjs/loader.js:915:16)
at Module._compile (internal/modules/cjs/loader.js:963:27)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
at Module.load (internal/modules/cjs/loader.js:863:32)
at Function.Module._load (internal/modules/cjs/loader.js:708:14)
at Module.require (internal/modules/cjs/loader.js:887:19)
at Module.mod.require (/home/ubuntu/light-client-web/node_modules/next/dist/server/require-hook.js:64:28)
at require (internal/modules/cjs/helpers.js:74:18)
at Object. (/home/ubuntu/light-client-web/node_modules/next/dist/build/output/log.js:55:21)
at Module._compile (internal/modules/cjs/loader.js:999:30)

[bug] Site becomes unresponsive on some block loads

we need to brainstorm as on why is this happening in the first place

1. the data matrix might be to render heavy when there's a lot of data (#30 might fix this)
2. current implementation usessubscribeFinalizedHeads which might be causing this, we can try to switch to avail-js-sdk and verify this thesis #32

[Bug] Duplicate tailwind config

We don't need tailwind.config.ts in here

upgrade to turing + refactor to avail-js-sdk

the LC has stopped working, for blocks with no da submissions since there are no commitments, have to fix this.

[frontend] Loading Component before the first block loads.

We can have a loading component or ghost ui until the first block loads so the page doesn't look empty.
Currently it looks like this before we see the first block.

[email protected] - Contributor

New WebClient installed (http://3.80.156.128:3000/
@jez2017
Discord:jez5728
[email protected]

[frontend] Failed to approve sign request

Cannot estimate fee to approve txn, so can't mint NFT on https://lightclient.availproject.org/

[frontend] rendering multiple cells as one when matrix becomes scrollable

Currently when the data matrix exceeds a certain limit, the matrix rendered on the frontend becomes scrollable, we should have some logic that above a certain size, each cell in the frontend represents multiple cells rather than scrolling to see the full matrix + cells getting sampled.

[feature] connect web LC to light client p2p network

The current implementation of the Web LC is standalone and does not connect to Avail's light client p2p network.

Look at the implementation of libp2p on avail-light

The scope would be to connect the web LC to the p2p network and display some indicator of it on front end.

Light Client Guide Via Mobile

First go to:
https://light.avail.tools/

Second:
Click Start Running LC

Third:
Wait for it to create blocks.
Congratulations you are now running Avail lght client.

Discord: @cryptobike07
Telegram: @cryptobike07

[refactor] Switch from using polkadot-js to avail-js-sdk

instead of using the polkadot js for getting the block headers, we can use avail-js-sdk

// example code which fetches the latest headers

import { initialize } from "avail-js-sdk"
const api = await initialize()
let lastHeader = (await api.rpc.chain.getHeader()).toJSON();
    console.log((lastHeader.extension));
console.log("subscribed headers", lastHeader)