mirror of
https://github.com/fluencelabs/examples
synced 2024-12-04 19:20:17 +00:00
merge curl_template
This commit is contained in:
boneyard93501
commit
da0b83d3dd
1
.gitignore
vendored
1
.gitignore
vendored
@ -5,3 +5,4 @@
|
||||
**/**.bk
|
||||
/artifacts
|
||||
keypair.json
|
||||
|
||||
|
||||
6
curl_template/.gitignore
vendored
Normal file
6
curl_template/.gitignore
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
target
|
||||
node_modules
|
||||
.idea
|
||||
.DS_Store
|
||||
.vscode
|
||||
.repl_history
|
||||
40
curl_template/README.md
Normal file
40
curl_template/README.md
Normal file
@ -0,0 +1,40 @@
|
||||
# Download & return URL via curl
|
||||
|
||||
An example repo to kick-off building services on Fluence.
|
||||
|
||||
What it does:
|
||||
- exploits `mounted_binaries` to call `/usr/bin/curl` on the host OS
|
||||
- downloads any url, and returns its content as a resulting `String`
|
||||
|
||||
# BackendConfig.json
|
||||
Wasm module is configured with this simple [JSON config](backend/BackendConfig.json):
|
||||
```json5
|
||||
{
|
||||
// import name of the module; needed when linking modules in multi-module setups
|
||||
"name": "curl_adapter",
|
||||
// binaries available to call
|
||||
"mountedBinaries":
|
||||
{
|
||||
// curl will be callable as a host function
|
||||
"curl": "/usr/bin/curl"
|
||||
}
|
||||
}
|
||||
```
|
||||
P.S. JSON5 has comments! yaaay!
|
||||
|
||||
# Build & deploy it
|
||||
```shell
|
||||
./deploy.sh
|
||||
```
|
||||
|
||||
# Call it
|
||||
```shell
|
||||
fldist run_air -p air.clj -d '{"service": "e90bfbaf-ede7-4fbe-b45a-6250bf36ed3e"}'
|
||||
```
|
||||
|
||||
# Run frontend
|
||||
```shell
|
||||
cd frontend
|
||||
npm i
|
||||
npm start
|
||||
```
|
||||
7
curl_template/air.clj
Normal file
7
curl_template/air.clj
Normal file
@ -0,0 +1,7 @@
|
||||
(xor
|
||||
(seq
|
||||
(call relay (service "request") ["https://api.duckduckgo.com/?q=homotopy&format=json"] result)
|
||||
(call %init_peer_id% (returnService "run") [result])
|
||||
)
|
||||
(call %init_peer_id% (returnService "run") [%last_error%])
|
||||
)
|
||||
7
curl_template/backend/BackendConfig.json
Normal file
7
curl_template/backend/BackendConfig.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"name": "backend",
|
||||
"mountedBinaries":
|
||||
{
|
||||
"curl": "/usr/bin/curl"
|
||||
}
|
||||
}
|
||||
177
curl_template/backend/Cargo.lock
generated
Normal file
177
curl_template/backend/Cargo.lock
generated
Normal file
@ -0,0 +1,177 @@
|
||||
# This file is automatically @generated by Cargo.
|
||||
# It is not intended for manual editing.
|
||||
[[package]]
|
||||
name = "cfg-if"
|
||||
version = "1.0.0"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "baf1de4339761588bc0619e3cbc0120ee582ebb74b53b4efbf79117bd2da40fd"
|
||||
|
||||
[[package]]
|
||||
name = "curl_template"
|
||||
version = "0.1.0"
|
||||
dependencies = [
|
||||
"fluence",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fluence"
|
||||
version = "0.3.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "84c621ecf5ba628a3a66c4571cb63b9e57de5b8e1ffbb4636873349d04ed9c4c"
|
||||
dependencies = [
|
||||
"fluence-sdk-macro",
|
||||
"fluence-sdk-main",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fluence-sdk-macro"
|
||||
version = "0.3.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "d3ed152de2a9f59c5494a5ead9d85b40cc1588696d10bb69129addebf0239efb"
|
||||
dependencies = [
|
||||
"fluence-sdk-wit",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fluence-sdk-main"
|
||||
version = "0.3.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "5ed74c32aded592c2a4c2d11a4586369e2d9f793e6c7b500a2a22f4a61769784"
|
||||
dependencies = [
|
||||
"fluence-sdk-macro",
|
||||
"log",
|
||||
"serde",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "fluence-sdk-wit"
|
||||
version = "0.3.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "a65bb11a2ebb063b8809e43c1837d32e44c12ba3c281e55f2fcf5c5819a6a9ad"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
"serde",
|
||||
"serde_json",
|
||||
"syn",
|
||||
"uuid",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "getrandom"
|
||||
version = "0.2.2"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "c9495705279e7140bf035dde1f6e750c162df8b625267cd52cc44e0b156732c8"
|
||||
dependencies = [
|
||||
"cfg-if",
|
||||
"libc",
|
||||
"wasi",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "itoa"
|
||||
version = "0.4.7"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "dd25036021b0de88a0aff6b850051563c6516d0bf53f8638938edbb9de732736"
|
||||
|
||||
[[package]]
|
||||
name = "libc"
|
||||
version = "0.2.86"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "b7282d924be3275cec7f6756ff4121987bc6481325397dde6ba3e7802b1a8b1c"
|
||||
|
||||
[[package]]
|
||||
name = "log"
|
||||
version = "0.4.14"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "51b9bbe6c47d51fc3e1a9b945965946b4c44142ab8792c50835a980d362c2710"
|
||||
dependencies = [
|
||||
"cfg-if",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "proc-macro2"
|
||||
version = "1.0.24"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "1e0704ee1a7e00d7bb417d0770ea303c1bccbabf0ef1667dae92b5967f5f8a71"
|
||||
dependencies = [
|
||||
"unicode-xid",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "quote"
|
||||
version = "1.0.9"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "c3d0b9745dc2debf507c8422de05d7226cc1f0644216dfdfead988f9b1ab32a7"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "ryu"
|
||||
version = "1.0.5"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "71d301d4193d031abdd79ff7e3dd721168a9572ef3fe51a1517aba235bd8f86e"
|
||||
|
||||
[[package]]
|
||||
name = "serde"
|
||||
version = "1.0.118"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "06c64263859d87aa2eb554587e2d23183398d617427327cf2b3d0ed8c69e4800"
|
||||
dependencies = [
|
||||
"serde_derive",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "serde_derive"
|
||||
version = "1.0.118"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "c84d3526699cd55261af4b941e4e725444df67aa4f9e6a3564f18030d12672df"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
"syn",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "serde_json"
|
||||
version = "1.0.63"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "43535db9747a4ba938c0ce0a98cc631a46ebf943c9e1d604e091df6007620bf6"
|
||||
dependencies = [
|
||||
"itoa",
|
||||
"ryu",
|
||||
"serde",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "syn"
|
||||
version = "1.0.60"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "c700597eca8a5a762beb35753ef6b94df201c81cca676604f547495a0d7f0081"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
"unicode-xid",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "unicode-xid"
|
||||
version = "0.2.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "f7fe0bb3479651439c9112f72b6c505038574c9fbb575ed1bf3b797fa39dd564"
|
||||
|
||||
[[package]]
|
||||
name = "uuid"
|
||||
version = "0.8.2"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "bc5cf98d8186244414c848017f0e2676b3fcb46807f6668a97dfe67359a3c4b7"
|
||||
dependencies = [
|
||||
"getrandom",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "wasi"
|
||||
version = "0.10.2+wasi-snapshot-preview1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "fd6fbd9a79829dd1ad0cc20627bf1ed606756a7f77edff7b66b7064f9cb327c6"
|
||||
9
curl_template/backend/Cargo.toml
Normal file
9
curl_template/backend/Cargo.toml
Normal file
@ -0,0 +1,9 @@
|
||||
[package]
|
||||
name = "curl_template"
|
||||
version = "0.1.0"
|
||||
authors = ["Fluence Labs"]
|
||||
edition = "2018"
|
||||
|
||||
|
||||
[dependencies]
|
||||
fluence = { version = "=0.3.3" }
|
||||
19
curl_template/backend/src/main.rs
Normal file
19
curl_template/backend/src/main.rs
Normal file
@ -0,0 +1,19 @@
|
||||
#![allow(improper_ctypes)]
|
||||
|
||||
use fluence::fce;
|
||||
use fluence::MountedBinaryStringResult as StringResult;
|
||||
use fluence::MountedBinaryResult as Result;
|
||||
|
||||
fn main() {}
|
||||
|
||||
#[fce]
|
||||
pub fn request(url: String) -> StringResult {
|
||||
unsafe { curl(vec!["-sS".into(), url]) }.stringify().unwrap()
|
||||
}
|
||||
|
||||
// mounted_binaries are available to import like this:
|
||||
#[fce]
|
||||
#[link(wasm_import_module = "host")]
|
||||
extern "C" {
|
||||
pub fn curl(cmd: Vec<String>) -> Result;
|
||||
}
|
||||
20
curl_template/deploy.sh
Executable file
20
curl_template/deploy.sh
Executable file
@ -0,0 +1,20 @@
|
||||
#!/usr/bin/env bash
|
||||
set -euo pipefail
|
||||
|
||||
# check `fcli` and `fldist` tools are installed or install them
|
||||
(command -v fce || cargo install fcli) >/dev/null
|
||||
(command -v fldist || npm install -g @fluencelabs/fldist) >/dev/null
|
||||
|
||||
# build .wasm
|
||||
(
|
||||
cd backend
|
||||
fce build --release
|
||||
)
|
||||
|
||||
# check it .wasm was built
|
||||
WASM="backend/target/wasm32-wasi/release/curl_template.wasm"
|
||||
test -f "$WASM" || echo >&2 "Couldn't find $WASM"
|
||||
|
||||
# create a service from that .wasm
|
||||
CONFIG="$(pwd)/backend/BackendConfig.json"
|
||||
fldist new_service --modules "$WASM:$CONFIG" --name curl_template
|
||||
24
curl_template/frontend/.gitignore
vendored
Normal file
24
curl_template/frontend/.gitignore
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.eslintcache
|
||||
8
curl_template/frontend/.prettierrc.js
Normal file
8
curl_template/frontend/.prettierrc.js
Normal file
@ -0,0 +1,8 @@
|
||||
module.exports = {
|
||||
semi: true,
|
||||
trailingComma: "all",
|
||||
singleQuote: true,
|
||||
printWidth: 120,
|
||||
tabWidth: 4,
|
||||
useTabs: false
|
||||
};
|
||||
15
curl_template/frontend/README.md
Normal file
15
curl_template/frontend/README.md
Normal file
@ -0,0 +1,15 @@
|
||||
|
||||
|
||||
## How to run
|
||||
|
||||
To run app in the development mode use:
|
||||
|
||||
npm start
|
||||
|
||||
To run tests in the interactive watch mode use:
|
||||
|
||||
npm test
|
||||
|
||||
To make a production build use:
|
||||
|
||||
npm run build
|
||||
18497
curl_template/frontend/package-lock.json
generated
Normal file
18497
curl_template/frontend/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
52
curl_template/frontend/package.json
Normal file
52
curl_template/frontend/package.json
Normal file
@ -0,0 +1,52 @@
|
||||
{
|
||||
"name": "fluent-pad",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@fluencelabs/fluence": "^0.9.17",
|
||||
"@fluencelabs/fluence-network-environment": "^1.0.8",
|
||||
"@testing-library/jest-dom": "^5.11.6",
|
||||
"@testing-library/react": "^11.2.2",
|
||||
"@testing-library/user-event": "^12.5.0",
|
||||
"@types/jest": "^26.0.19",
|
||||
"@types/node": "^12.19.9",
|
||||
"@types/react": "^16.14.2",
|
||||
"@types/react-dom": "^16.9.10",
|
||||
"node-sass": "^4.14.1",
|
||||
"react": "^17.0.1",
|
||||
"react-dom": "^17.0.1",
|
||||
"react-scripts": "4.0.1",
|
||||
"typescript": "^4.1.3",
|
||||
"web-vitals": "^0.2.4",
|
||||
"uuid": "8.3.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"parserOptions": {
|
||||
"ecmaVersion": 12
|
||||
},
|
||||
"extends": [
|
||||
"react-app",
|
||||
"react-app/jest"
|
||||
]
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
},
|
||||
"devDependencies": {}
|
||||
}
|
||||
BIN
curl_template/frontend/public/favicon.ico
Normal file
BIN
curl_template/frontend/public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
45
curl_template/frontend/public/index.html
Normal file
45
curl_template/frontend/public/index.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/tonsky/FiraCode@4/distr/fira_code.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>React App</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
BIN
curl_template/frontend/public/logo192.png
Normal file
BIN
curl_template/frontend/public/logo192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
BIN
curl_template/frontend/public/logo512.png
Normal file
BIN
curl_template/frontend/public/logo512.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
25
curl_template/frontend/public/manifest.json
Normal file
25
curl_template/frontend/public/manifest.json
Normal file
@ -0,0 +1,25 @@
|
||||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
}
|
||||
3
curl_template/frontend/public/robots.txt
Normal file
3
curl_template/frontend/public/robots.txt
Normal file
@ -0,0 +1,3 @@
|
||||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
199
curl_template/frontend/src/components/App.scss
Normal file
199
curl_template/frontend/src/components/App.scss
Normal file
@ -0,0 +1,199 @@
|
||||
$bg-color1: white;
|
||||
$bg-color2: #f4f4f4;
|
||||
$font-color1: black;
|
||||
$color-disabled: lightgray;
|
||||
|
||||
$color1: black;
|
||||
$color2: rgb(214, 214, 214);
|
||||
|
||||
$accent-color: rgb(225, 30, 90);
|
||||
|
||||
$header-height: 60px;
|
||||
$border-radius: 10px;
|
||||
|
||||
@mixin font($size) {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: $size;
|
||||
}
|
||||
|
||||
$shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
|
||||
|
||||
body {
|
||||
background-color: $bg-color2;
|
||||
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
.header-wrapper {
|
||||
padding: 0 20px;
|
||||
height: $header-height;
|
||||
|
||||
background-color: $bg-color1;
|
||||
color: $font-color1;
|
||||
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
width: 1200px;
|
||||
height: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
width: calc(100vw - 80px);
|
||||
margin-left: 20px;
|
||||
margin-right: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 1700px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 50px;
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
width: calc(100vw - 80px);
|
||||
margin-left: 35px;
|
||||
margin-right: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
.text-input {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
padding: 0 15px;
|
||||
box-sizing: border-box;
|
||||
|
||||
margin-top: 5px;
|
||||
border: none;
|
||||
|
||||
font-style: normal;
|
||||
@include font(15px);
|
||||
color: $color1;
|
||||
|
||||
box-shadow: $shadow;
|
||||
|
||||
&::placeholder {
|
||||
color: $color2;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
outline: 1px solid white;
|
||||
border: 1px solid $accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
|
||||
box-sizing: border-box;
|
||||
background-color: white;
|
||||
|
||||
margin-top: 10px;
|
||||
margin-right: 10px;
|
||||
border: none;
|
||||
|
||||
font-style: normal;
|
||||
@include font(15px);
|
||||
color: $color1;
|
||||
|
||||
box-shadow: $shadow;
|
||||
|
||||
&::placeholder {
|
||||
color: $color2;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
outline: 1px solid white;
|
||||
border: 1px solid $accent-color;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
|
||||
.form-caption {
|
||||
color: $accent-color;
|
||||
text-align: center;
|
||||
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
@include font(20px);
|
||||
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.header-item {
|
||||
@include font(14px);
|
||||
text-transform: uppercase;
|
||||
|
||||
& button {
|
||||
@include font(14px);
|
||||
text-transform: uppercase;
|
||||
|
||||
background: none;
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
border-left: none;
|
||||
border-bottom: 1px solid $accent-color;
|
||||
text-decoration: none;
|
||||
|
||||
outline: none;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $accent-color;
|
||||
border-bottom: 2px solid $accent-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.red {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.accent {
|
||||
color: $accent-color;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.table-wrapper {
|
||||
width: 100%;
|
||||
min-height: 800px;
|
||||
margin-top: 50px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
background-color: white;
|
||||
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
th {
|
||||
@include font(18px);
|
||||
min-width: 100px;
|
||||
border-bottom: 20px solid transparent;
|
||||
}
|
||||
|
||||
td {
|
||||
@include font(14px);
|
||||
border-left: 15px solid transparent;
|
||||
border-right: 15px solid transparent;
|
||||
}
|
||||
93
curl_template/frontend/src/components/App.tsx
Normal file
93
curl_template/frontend/src/components/App.tsx
Normal file
@ -0,0 +1,93 @@
|
||||
import { createClient, FluenceClient } from '@fluencelabs/fluence';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import {
|
||||
relayNode,
|
||||
curlRequest
|
||||
} from 'src/fluence';
|
||||
|
||||
import './App.scss';
|
||||
|
||||
const App = () => {
|
||||
const [client, setClient] = useState<FluenceClient | null>(null);
|
||||
const [url, setUrl] = useState('https://api.duckduckgo.com/?q=homotopy&format=json');
|
||||
const [data, setData] = useState<{url: String, response: String}[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
const fn = async () => {
|
||||
try {
|
||||
const client = await createClient(relayNode);
|
||||
setClient(client);
|
||||
} catch (err) {
|
||||
console.log('Client initialization failed', err);
|
||||
}
|
||||
};
|
||||
fn();
|
||||
}, []);
|
||||
|
||||
const request = async () => {
|
||||
if (!client) {
|
||||
return;
|
||||
}
|
||||
|
||||
let response = await curlRequest(client, url, 10000);
|
||||
setData((prev) => [...prev, { url, response }]);
|
||||
};
|
||||
|
||||
const stop = async () => {
|
||||
if (!client) {
|
||||
return;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="header-wrapper">
|
||||
<div className="header">
|
||||
<div className="header-item"></div>
|
||||
|
||||
<div className="header-item">
|
||||
Connection status: {client ? <span className="accent">connected</span> : 'disconnected'}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div>Url. e.g: https://google.com</div>
|
||||
<div>
|
||||
<input
|
||||
className="text-input"
|
||||
onChange={(e) => setUrl(e.target.value)}
|
||||
type="text"
|
||||
value={url}
|
||||
/>
|
||||
</div>
|
||||
<div className="buttons">
|
||||
<button disabled={!url} className="button" onClick={request}>
|
||||
request
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="table-wrapper">
|
||||
<table className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Request log.</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{data.map(({url, response}, idx) => (
|
||||
<tr>
|
||||
<td className="td1">{url}</td>
|
||||
<td className="td2">{response}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default App;
|
||||
34
curl_template/frontend/src/fluence.ts
Normal file
34
curl_template/frontend/src/fluence.ts
Normal file
@ -0,0 +1,34 @@
|
||||
import { FluenceClient, Particle, sendParticleAsFetch } from '@fluencelabs/fluence';
|
||||
import { testNet } from '@fluencelabs/fluence-network-environment';
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
|
||||
export const relayNode = testNet[3];
|
||||
const node = relayNode.peerId;
|
||||
|
||||
const serviceId = 'e90bfbaf-ede7-4fbe-b45a-6250bf36ed3e';
|
||||
|
||||
export const curlRequest = async (client: FluenceClient, url: String, ttl: number) => {
|
||||
const script = `
|
||||
(seq
|
||||
(call myRelay ("op" "identity") [])
|
||||
(seq
|
||||
(call node (serviceId "request") [url] result)
|
||||
(seq
|
||||
(call myRelay ("op" "identity") [])
|
||||
(call myPeerId ("_callback" callback) [result])
|
||||
)
|
||||
)
|
||||
)
|
||||
`;
|
||||
|
||||
let callbackId = uuidv4();
|
||||
const data = new Map();
|
||||
data.set('node', node);
|
||||
data.set('serviceId', serviceId);
|
||||
data.set('myRelay', client.relayPeerId);
|
||||
data.set('myPeerId', client.selfPeerId);
|
||||
data.set('callback', callbackId);
|
||||
data.set('url', url);
|
||||
|
||||
return await sendParticleAsFetch<String>(client, new Particle(script, data, ttl), callbackId);
|
||||
};
|
||||
144
curl_template/frontend/src/index.scss
Normal file
144
curl_template/frontend/src/index.scss
Normal file
@ -0,0 +1,144 @@
|
||||
/* http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
*/
|
||||
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
q {
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
14
curl_template/frontend/src/index.tsx
Normal file
14
curl_template/frontend/src/index.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import './index.scss';
|
||||
import App from './components/App';
|
||||
import log from 'loglevel';
|
||||
|
||||
log.setLevel('error');
|
||||
|
||||
ReactDOM.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root'),
|
||||
);
|
||||
1
curl_template/frontend/src/react-app-env.d.ts
vendored
Normal file
1
curl_template/frontend/src/react-app-env.d.ts
vendored
Normal file
@ -0,0 +1 @@
|
||||
/// <reference types="react-scripts" />
|
||||
5
curl_template/frontend/src/setupTests.ts
Normal file
5
curl_template/frontend/src/setupTests.ts
Normal file
@ -0,0 +1,5 @@
|
||||
// jest-dom adds custom jest matchers for asserting on DOM nodes.
|
||||
// allows you to do things like:
|
||||
// expect(element).toHaveTextContent(/react/i)
|
||||
// learn more: https://github.com/testing-library/jest-dom
|
||||
import '@testing-library/jest-dom';
|
||||
30
curl_template/frontend/tsconfig.json
Normal file
30
curl_template/frontend/tsconfig.json
Normal file
@ -0,0 +1,30 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"lib": [
|
||||
"dom",
|
||||
"dom.iterable",
|
||||
"esnext"
|
||||
],
|
||||
"baseUrl": ".",
|
||||
"noImplicitAny": false,
|
||||
"experimentalDecorators": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"jsx": "react-jsx"
|
||||
},
|
||||
"include": [
|
||||
"src"
|
||||
]
|
||||
}
|
||||
8
curl_template/repl_config.toml
Normal file
8
curl_template/repl_config.toml
Normal file
@ -0,0 +1,8 @@
|
||||
modules_dir = "backend/target/wasm32-wasi/release/"
|
||||
|
||||
[[module]]
|
||||
name = "curl_template"
|
||||
logger_enabled = true
|
||||
|
||||
[module.mounted_binaries]
|
||||
curl = "/usr/bin/curl"
|
||||
Loading…
Reference in New Issue
Block a user