Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add react-vite example #35

Open
wants to merge 46 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
46 commits
Select commit Hold shift + click to select a range
8e3cee5
added react-vite
amochuko May 21, 2024
f709536
feat: added usePostageStamp hook
amochuko May 21, 2024
cc261f1
feat: added CreatePostageBatch
amochuko May 21, 2024
bb1b5a3
feat: added upload hook
amochuko May 23, 2024
2552173
feat: added postageStamp comp
amochuko May 23, 2024
6f308fc
feat: add util for text formating
amochuko May 23, 2024
50c91be
feat: added footer comp
amochuko May 23, 2024
32c33ac
feat: added NodeHealth comp
amochuko May 23, 2024
f539925
fix: updated getAllPostageStamps with useCallback
amochuko May 23, 2024
98fdb69
fix: removed comment
amochuko May 23, 2024
24b48e2
fix: bump bee-js to ^7.1.0
amochuko Jul 25, 2024
d7ac17c
fix: refactored for new api
amochuko Jul 25, 2024
9fc719d
fix: corrected style
amochuko Jul 26, 2024
1a8d71e
fix: refactored
amochuko Jul 26, 2024
f731190
fix: renamed file
amochuko Jul 26, 2024
63a054e
fix: renamed file + code refactor
amochuko Jul 26, 2024
2e868af
fix: refactored comp into own file
amochuko Jul 26, 2024
44860d7
feat: useNodeHealth hook
amochuko Jul 26, 2024
f331345
feat: add useWallet hook
amochuko Jul 26, 2024
f0d6557
fix: memory leak for useEffect
amochuko Jul 29, 2024
83d2f49
feat: add GetBalance comp;
amochuko Jul 29, 2024
9e4deab
fix: updated tags
amochuko Jul 29, 2024
3362737
feat: added clipboard comp
amochuko Jul 30, 2024
fd2abfc
fix: updated clipboard function
amochuko Jul 30, 2024
01de0c0
fix: updated with node status
amochuko Jul 31, 2024
f9e4a15
fix: update min depth value
amochuko Jul 31, 2024
0ead0f4
fix: updated with props
amochuko Jul 31, 2024
2cd0ccb
feat: add upload function
amochuko Aug 5, 2024
5540a64
feat: add upload form
amochuko Aug 5, 2024
c47da85
feat: add getFileSize
amochuko Aug 5, 2024
d5a8245
fix: add form validation
amochuko Aug 5, 2024
1df03ac
feat: add manifestJs and hook usage
amochuko Aug 5, 2024
594c751
fix: move preview to own component
amochuko Aug 5, 2024
03efeda
fix: add tooltip
amochuko Aug 5, 2024
e42ad58
fix: made clean up
amochuko Aug 5, 2024
24b4fd0
fix: made general housing cleaning
amochuko Aug 5, 2024
2386426
fix: update constant
amochuko Aug 5, 2024
eec810b
feat: add ttl estimation amount and form validation
amochuko Aug 7, 2024
d64e388
fix: made clean up to variables
amochuko Aug 7, 2024
7916057
feat: add clipboard and rename variable
amochuko Aug 7, 2024
7ccf1ef
fix: rename
amochuko Aug 7, 2024
464cfa8
fix: rename util file and remove testing component
amochuko Aug 7, 2024
bb7e152
fix: update ui when bee node not active
amochuko Aug 8, 2024
404629c
fix: update link to a manifest hashes
amochuko Aug 8, 2024
e490730
fix: update README.md
amochuko Aug 18, 2024
d6bd89f
fix: update README.md
amochuko Aug 18, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions react-vite/.eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:react/jsx-runtime',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parser: '@typescript-eslint/parser',
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
settings: { react: { version: '18.2' } },
plugins: ['react-refresh'],
rules: {
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
'react/prop-types': 0,
},
};
24 changes: 24 additions & 0 deletions react-vite/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
27 changes: 27 additions & 0 deletions react-vite/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# React + Vite + (typescript)

This is a sample project that shows off the functionalities of the Swarm network, and serves as a simple example for developers looking to build a dApp that uses the decentralised Swarm storage with Vite Frontend Tooling setup.

## Dev Stacks

1. Node.js 16 or higher (LTS)
2. Vite as the bundler
3. Modern React (functional components)
4. Latest @ethersphere/bee-js version

### Functionality

1. List available postage batches
2. Create new postage batch
3. Upload file(s)
4. Access to uploaded file

### Usage

To use the app, you should have a Bee node running either locally or remotely for which you're going to need the exposed url/port to connect to via the home page of the app.

Install dependencies, start the app and generate a static version of app

1. `npm install`
2. `npm start`
3. `npm run build`
13 changes: 13 additions & 0 deletions react-vite/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Bee-js React-Vite Example</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
Loading