Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@
"resolutions": {
"@agoric/swingset-liveslots": "0.10.3-dev-8c14632.0",
"@agoric/xsnap@npm:^0.14.3-u14.0": "patch:@agoric/xsnap@npm%3A0.14.3-u14.0#~/.yarn/patches/@agoric-xsnap-npm-0.14.3-u14.0-768ce73dba.patch",
"@agoric/xsnap@npm:^0.14.2": "patch:@agoric/xsnap@npm%3A0.14.3-u14.0#~/.yarn/patches/@agoric-xsnap-npm-0.14.3-u14.0-768ce73dba.patch"
"@agoric/xsnap@npm:^0.14.2": "patch:@agoric/xsnap@npm%3A0.14.3-u14.0#~/.yarn/patches/@agoric-xsnap-npm-0.14.3-u14.0-768ce73dba.patch",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we still need to patch?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just tried removing it and got:

samsiegart@DESKTOP-4J303UV:~/ui-kit$ yarn
➤ YN0000: · Yarn 4.2.2
➤ YN0000: ┌ Resolution step
➤ YN0001: │ Error: @agoric/base-zone@workspace:*: Workspace not found (@agoric/base-zone@workspace:*)
    at St.getWorkspaceByDescriptor (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:210:3520)
    at l1.getCandidates (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:140:115276)
    at Pd.getCandidates (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:141:1311)
    at Pd.getCandidates (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:141:1311)
    at /home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:210:8409
    at Ky (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:140:53916)
    at Fe (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:210:8389)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Promise.allSettled (index 0)
    at async _c (/home/samsiegart/.cache/node/corepack/v1/yarn/4.2.2/yarn.js:140:53244)
➤ YN0000: └ Completed in 1s 362ms
➤ YN0000: · Failed with errors in 1s 382ms

Maybe another tech debt task to remove xsnap as a dependency here. I think it has to do with @agoric/web-components depending on ertp or notifier or something like that.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah this shouldn't need xsnap. Let's punt on solving this deps problem.

"esbuild": "0.21.5"
}
}
18 changes: 0 additions & 18 deletions packages/example/.eslintrc.cjs

This file was deleted.

53 changes: 31 additions & 22 deletions packages/example/README.md
Original file line number Diff line number Diff line change
@@ -1,30 +1,39 @@
# React + TypeScript + Vite
This is an Interchain App project bootstrapped with [`create-interchain-app`](https://github.com/hyperweb-io/create-interchain-app).

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
## Getting Started

Currently, two official plugins are available:
First, install the packages and run the development server:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
```bash
yarn install && yarn dev
```

## Expanding the ESLint configuration
Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
You can start editing the page by modifying `src/App.tsx`. The page auto-updates as you edit the file.

- Configure the top-level `parserOptions` property like this:
## Interchain JavaScript Stack

```js
export default {
// other rules...
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
project: ['./tsconfig.json', './tsconfig.node.json'],
tsconfigRootDir: __dirname,
},
};
```
A unified toolkit for building applications and smart contracts in the Interchain ecosystem ⚛️

| Category | Tools | Description |
| ------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------- |
| **Chain Information** | [**Chain Registry**](https://github.com/hyperweb-io/chain-registry), [**Utils**](https://www.npmjs.com/package/@chain-registry/utils), [**Client**](https://www.npmjs.com/package/@chain-registry/client) | Everything from token symbols, logos, and IBC denominations for all assets you want to support in your application. |
| **Wallet Connectors** | [**Interchain Kit**](https://github.com/hyperweb-io/interchain-kit)<sup>beta</sup>, [**Cosmos Kit**](https://github.com/hyperweb.io/cosmos-kit) | Experience the convenience of connecting with a variety of web3 wallets through a single, streamlined interface. |
| **Signing Clients** | [**InterchainJS**](https://github.com/hyperweb-io/interchainjs)<sup>beta</sup>, [**CosmJS**](https://github.com/cosmos/cosmjs) | A single, universal signing interface for any network |
| **SDK Clients** | [**Telescope**](https://github.com/hyperweb.io/telescope) | Your Frontend Companion for Building with TypeScript with Cosmos SDK Modules. |
| **Starter Kits** | [**Create Interchain App**](https://github.com/hyperweb-io/create-interchain-app)<sup>beta</sup>, [**Create Cosmos App**](https://github.com/hyperweb.io/create-cosmos-app) | Set up a modern Interchain app by running one command. |
| **UI Kits** | [**Interchain UI**](https://github.com/hyperweb.io/interchain-ui) | The Interchain Design System, empowering developers with a flexible, easy-to-use UI kit. |
| **Testing Frameworks** | [**Starship**](https://github.com/hyperweb.io/starship) | Unified Testing and Development for the Interchain. |
| **TypeScript Smart Contracts** | [**Create Hyperweb App**](https://github.com/hyperweb-io/create-hyperweb-app) | Build and deploy full-stack blockchain applications with TypeScript |
| **CosmWasm Contracts** | [**CosmWasm TS Codegen**](https://github.com/CosmWasm/ts-codegen) | Convert your CosmWasm smart contracts into dev-friendly TypeScript classes. |

## Credits

🛠 Built by Hyperweb (formerly Cosmology) — if you like our tools, please checkout and contribute to [our github ⚛️](https://github.com/hyperweb-io)

## Disclaimer

AS DESCRIBED IN THE LICENSES, THE SOFTWARE IS PROVIDED “AS IS”, AT YOUR OWN RISK, AND WITHOUT WARRANTIES OF ANY KIND.

- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
No developer or entity involved in creating this software will be liable for any claims or damages whatsoever associated with your use, inability to use, or your interaction with other users of the code, including any direct, indirect, incidental, special, exemplary, punitive or consequential damages, or loss of profits, cryptocurrencies, tokens, or anything else of value.
28 changes: 28 additions & 0 deletions packages/example/eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'

export default tseslint.config(
{ ignores: ['dist'] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ['**/*.{ts,tsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
},
)
44 changes: 24 additions & 20 deletions packages/example/package.json
Original file line number Diff line number Diff line change
@@ -1,32 +1,36 @@
{
"name": "example",
"name": "@agoric/ui-kit-example",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does the name matter?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah it doesn't sorry, just reverted it. It's because this project was generated with create-interchain-app initially then copied in, so I gave it a different name at first.

I also realized I ended up removing all the interchain-kit stuff from this, so I'm going to update the readme.

"private": true,
"version": "0.0.0",
"version": "0.0.1",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"postinstall": "patch-package",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@agoric/react-components": "0.4.0",
"patch-package": "^7.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"ses": "1.3.0"
"@agoric/react-components": "^0.5.0",
"@agoric/rpc": "^0.10.0",
"@agoric/web-components": "^0.17.0",
"buffer": "^6.0.3",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@types/react": "^18.2.66",
"@types/react-dom": "^18.2.22",
"@typescript-eslint/eslint-plugin": "^7.2.0",
"@typescript-eslint/parser": "^7.2.0",
"@vitejs/plugin-react": "^4.2.1",
"eslint": "^8.57.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.6",
"typescript": "^5.2.2",
"vite": "^5.2.0"
"@esbuild-plugins/node-globals-polyfill": "^0.2.3",
"@eslint/js": "^9.9.1",
"@keplr-wallet/types": "^0.12.271",
"@types/react": "^18.3.5",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react": "^4.3.1",
"eslint": "^9.9.1",
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
"eslint-plugin-react-refresh": "^0.4.11",
"globals": "^15.9.0",
"typescript": "^5.5.3",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does 5.9 work? Use '~' since TS doesn't follow semver

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems to work, updated 👍

This was just generated by create-interchain-app initially

"typescript-eslint": "^8.3.0",
"vite": "^5.4.2",
"vite-plugin-node-polyfills": "^0.24.0"
}
}
1 change: 1 addition & 0 deletions packages/example/public/vite.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
67 changes: 28 additions & 39 deletions packages/example/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,47 +1,36 @@
import { AgoricProvider, ConnectWalletButton } from '@agoric/react-components';
import { wallets } from 'cosmos-kit';
import { ThemeProvider, useTheme } from '@interchain-ui/react';
import '@agoric/react-components/dist/style.css';
import { useEffect } from 'react';
import WalletDetails from './components/WalletDetails';
import { useWalletManager } from './hooks/useWalletManager';
import { AgoricProvider } from '@agoric/react-components';
import { CHAIN_ID, REST_ENDPOINT, RPC_ENDPOINT } from './utils/constants';

const localnet = {
testChain: {
chainId: 'agoriclocal',
chainName: 'agoric-local',
},
apis: {
rest: ['http://localhost:1317'],
rpc: ['http://localhost:26657'],
iconUrl: '/agoriclocal.svg', // Optional icon for Network Dropdown component
},
};
function App() {
const { address, connectWallet, offlineSigner } = useWalletManager();

// Omit "testChain" to specify the apis for Agoric Mainnet.
const mainnet = {
apis: {
rest: ['https://main.api.agoric.net'],
rpc: ['https://main.rpc.agoric.net'],
},
};
useEffect(() => {
connectWallet();
}, [connectWallet]);

const App = () => {
const { themeClass } = useTheme();
return (
<ThemeProvider>
<div className={themeClass}>
<AgoricProvider
wallets={wallets.extension}
agoricNetworkConfigs={[localnet, mainnet]}
/**
* If unspecified, connects to Agoric Mainnet by default.
* See "Network Dropdown" below to see how to switch between Agoric testnets.
*/
defaultChainName="agoric-local"
>
<ConnectWalletButton />
</AgoricProvider>
<AgoricProvider
restEndpoint={REST_ENDPOINT}
rpcEndpoint={RPC_ENDPOINT}
offlineSigner={offlineSigner}
address={address}
chainName={CHAIN_ID}
>
<div>
<div>
<h1> Agoric Wallet</h1>
{!address ? (
<button onClick={connectWallet}>Connect Keplr</button>
) : (
<WalletDetails />
)}
</div>
</div>
</ThemeProvider>
</AgoricProvider>
);
};
}

export default App;
1 change: 1 addition & 0 deletions packages/example/src/assets/react.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading