9934ad1cfd
* wip: combobox refactor * refactor: new combobox styling * refactor: rename new combobox * wip: refactor combobox factory * refactor: new combobox single component * wip: refactor form combobox * refactor: github branches typing * refactor: ens field form combobox * fix: readd removed branch icon * refactor: replace nfa picker combobox * refactor: remove old combobox * refactor: rename combobox factory * fix: remove leftover combobox code * refactor: query filter by keys * fix: create ap form title * fix: max combobox options height * feat: add chevron on combobox field * refactor: optmize elements generation structure * chore: add todo comments for things thats going to change * fix: code comment addressed on pr |
||
|---|---|---|
| .. | ||
| graphql | ||
| src | ||
| .eslintrc.js | ||
| .gitignore | ||
| .graphclientrc.yml | ||
| .prettierrc | ||
| README.md | ||
| fleek.json | ||
| index.html | ||
| package.json | ||
| postcss.config.js | ||
| tailwind.config.js | ||
| tsconfig.json | ||
| vite.config.ts | ||
| yarn.lock | ||
README.md
⚡ Overview
Minimal UI to interact with the contract, build with React. It will allow you to:
- Mint your site
- List the minted sites
- View the details of the minted site
⚙️ Requirements
You'll need to have nodejs and YARN installed. Please do not use NPM for package installation.
Also, don't forget to check the Getting started section on the wiki if you didn't do it yet, cause you need to configure your wallet to be able to mint a site.
Setting Contract Address and ABI
The contract address and ABI is set by pointing ui/src/integrations/ethereum/contracts/FleekERC721.json to the file from the deployment outputs in the contract sub project.
This can be a local deployment or a deployment on one of the networks. This maintains consistency between the deployed contracts and the info in the UI configuration.
🖥️ Running
To run the UI localy follow the steps:
-
Clone the repo, check out how here.
-
Install the dependencies:
$ yarnThis also will generate the
.graphclientfolder. Every time you do a change on the queries files, you'll have to build again that folder, to do it run:$ yarn graphclient build -
To use ConnecKit is neccessary get an Alchemy ID, so create an App and get the credentials. Then set the following .env file
VITE_ALCHEMY_API_KEY VITE_ALCHEMY_APP_NAMEAlso, you'll need to set up your firebase cretendials to make work the github login. Add to the .env file the following variables
VITE_FIREBASE_API_KEY VITE_FIREBASE_AUTH_DOMAIN VITE_FIREBASE_PROJECT_ID VITE_FIREBASE_STORAGE_BUCKET VITE_FIREBASE_MESSAGING_SENDER_ID VITE_FIREBASE_APP_ID VITE_FIREBASE_MEASUREMENT_ID
Get them from the project settings on the firebase dashboard. Read this article to know how to get your porject config
-
To interact with the contract, you need to set the Goerli RPC. Set this variable on the .env file
VITE_GOERLI_RPC -
Start the local server running the app:
$ yarn devNow a local server should be running on http://localhost:5173.
🤖 Build public
As we use vite, to build a public distribution for production run:
$ vite build
This will create a dist folder for the deployment.