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.

Sign up for GitHub

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

Jump to bottom

Add UI templates to init #119

Open
6 tasks
codespool opened this issue Feb 26, 2023 · 5 comments · May be fixed by #212
Open
6 tasks

Add UI templates to init #119

codespool opened this issue Feb 26, 2023 · 5 comments · May be fixed by #212
Assignees
@prxgr4mm3r
Labels
enhancement New feature or request
Milestone
Grant proposal ro...

Comments

@codespool
Copy link
Collaborator

codespool commented Feb 26, 2023 •
edited by prxgr4mm3r
Loading

Overview (What and Why)

To make swanky all-around tool, the frontend part should also be taken into consideration.

For the contract template we provide, there should also be UI templates ready to add.

How

Init command and new contract command should offer to add the UI templates as well.

Optionally, there should be a choice of fronted frameworks (react/vue/svelte), but React with useink should be enough for the first iteration.

Definition of Done

  • UI templates added to templates package
  • init command offers to add UI template
  • contract new command offers to add UI template
  • new contract command to add UI template to existing contract
  • all changes merged
  • docs updated

Open Issues and Blockers

Work was started on this, but since adding UI project (a dapp) introduces yet another layer of dependencies on polkadot.js, the compatibility issues had to be addressed first.

To address this, focus was shifted to the swanky-dev-container and swanky and swanky-node updates to newer versions of ink! and weights V2.

Since more urgent/useful features were suggested in the meantime, this was given a lower prio.
@codespool codespool added the enhancement New feature or request label Feb 26, 2023
@codespool
Copy link
Collaborator Author

polkadot.js duplication issues have been resolved with the switch to ESM in v3, and this is now ready to be considered again.

@codespool codespool added this to the Grant proposal roadmap milestone Jul 5, 2023
@prxgr4mm3r prxgr4mm3r linked a pull request Jan 31, 2024 that will close this issue
Add frontend templates #197
Closed
@ipapandinas
Copy link
Contributor

ipapandinas commented Feb 19, 2024 •
edited
Loading

With the recent shift from useInk to useInkathon, the approach to setting up a Swanky project with integrated frontend and smart contract development needs to adapt. The idea is still to spin up a "fullstack monorepo" development environment project of a real full stack ink! app. I suggest leveraging useInkathon for frontend development and streamlining the setup process for a Swanky project using the Flipper contract template first. Here is a new "Definition of Done" suggestion:

  • Develop a new, customized frontend UI template tailored to Swanky.
  • Incorporate React hooks from useInkathon into the frontend template to interact with the Swanky project local configuration (contract deployments, networks, accounts).
  • init & new command offers to add frontend UI template (for flipper contract template only).
  • init command prints next steps to onboard/upskill new users: compile the contract, start the swanky node and start the frontend dev server.

And optional but recommend additional tasks:

  • Optional: Support Shibuya testnet with faucet link and a one well-known Flipper contract instance already deployed.
  • Optional: Refactor deploy, query, tx commands and ContractCall class to use useInkathon helpers for basic contract interactions.
  • Optional: Support Wallet connection, otherwise we can only use Swanky key management

Alternative options considered:

  • implement our own ink-contract-helpers package with generic helpers over any message/args and react hooks
  • maintain archived useInk frontend template that looks like this
useInk

@vsofiya Let me know how we should prioritize this scope.

@ipapandinas ipapandinas mentioned this issue Feb 19, 2024
Closed
@codespool
Copy link
Collaborator Author

Sound great!
Why monorepo though? Sounds like an overkill for just two packages, and would probably increase complexity unnecessarily.

@ipapandinas
Copy link
Contributor

The term "monorepo" was mistakenly used; I meant to refer to the project structure generated by the swanky init command, which establishes a "fullstack monorepo" development environment as follows:

swanky-project/
├── artifacts/
├── contracts/
├── frontend/
└── tests/

@codespool
Copy link
Collaborator Author

Ah, great, thanks for clarification.
I see no problem with this proposal, would be a great adtion to swanky 👍

@ipapandinas ipapandinas linked a pull request Mar 7, 2024 that will close this issue
feat: UI template #212
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@prxgr4mm3r prxgr4mm3r

Labels
enhancement New feature or request
Projects
Treasury Proposal Roadmap - ink!DevHub 1.0
Status: 👀 In review
Milestone
Grant proposal roadmap
Development

Successfully merging a pull request may close this issue.

feat: UI template inkdevhub/swanky-cli
Add frontend templates inkdevhub/swanky-cli
3 participants
@codespool @ipapandinas @prxgr4mm3r