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

Implement modal for Concentrated Liquidity Pool creation #3452

Merged
merged 25 commits into from
Jul 10, 2024
Merged

Implement modal for Concentrated Liquidity Pool creation #3452

merged 25 commits into from
Jul 10, 2024

Conversation

fabryscript
Copy link
Collaborator

@fabryscript fabryscript commented Jul 4, 2024 •
edited
Loading

What is the purpose of the change:

Address #2727. Implement a modal for the creation of a concentrated liquidity pool

TODOs

  • Compute real poolId after pool creation
  • Compute implied value
  • Compute max tick into sendCreateConcentratedLiquidityPositionMsg tx
  • Refactor step 1 flow
  • Investigate listbox re-render issue

Linear Task

Brief Changelog

Testing and Verifying

This change has been tested fully against the official testnet and it works as expected.

@vercel Vercel
Copy link

vercel bot commented Jul 4, 2024

@fabryscript is attempting to deploy a commit to the OsmoLabs Team on Vercel.

A member of the Team first needs to authorize it.

@fabryscript fabryscript self-assigned this Jul 4, 2024
@fabryscript fabryscript mentioned this pull request Jul 4, 2024
Closed
@fabryscript fabryscript marked this pull request as ready for review July 6, 2024 23:37
@coderabbitai coderabbitai
Copy link
Contributor

coderabbitai bot commented Jul 6, 2024 •
edited
Loading

Walkthrough

These changes introduce a new feature for creating pools and managing initial liquidity within a web application. A significant update includes adding the CreateCLPool React component and related components for setting base information and adding initial liquidity to the pool. Additionally, a new method for creating concentrated liquidity positions is added to the OsmosisAccountImpl class in the stores package.

Changes

File Path Summary
packages/stores/src/account/osmosis/index.ts Added a method for creating concentrated liquidity positions in the OsmosisAccountImpl class.
packages/web/components/complex/pool/create/cl-pool.tsx Introduced the CreateCLPool component for setting base info and adding initial liquidity to a pool.
packages/web/components/complex/pool/create/cl/add-initial-liquidity.tsx Added components and logic for adding initial liquidity to a pool.
packages/web/components/complex/pool/create/cl/set-base-info.tsx Introduced the SetBaseInfos component for setting base info such as tokens and swap fees.
packages/web/components/complex/pool/create/select-type.tsx Updated SelectType component to use dynamic configuration for rendering pool type buttons/images.
packages/web/modals/create-pool.tsx Adjustments in rendering logic based on isConcentrated state and added CreateCLPool component.
Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between 2b09ba1 and 54c7196.

Files ignored due to path filters (2)
  • packages/web/public/icons/sprite.svg is excluded by !**/*.svg, !**/*.svg
  • yarn.lock is excluded by !**/yarn.lock, !**/*.lock, !**/*.lock
Files selected for processing (6)
  • packages/stores/src/account/osmosis/index.ts (2 hunks)
  • packages/web/components/complex/pool/create/cl-pool.tsx (1 hunks)
  • packages/web/components/complex/pool/create/cl/add-initial-liquidity.tsx (1 hunks)
  • packages/web/components/complex/pool/create/cl/set-base-info.tsx (1 hunks)
  • packages/web/components/complex/pool/create/select-type.tsx (3 hunks)
  • packages/web/modals/create-pool.tsx (2 hunks)
Additional comments not posted (30)
packages/web/modals/create-pool.tsx (8)

2-2: LGTM!

The new imports classnames and CreateCLPool are appropriate for the added functionality.

Also applies to: 12-12

38-41: LGTM!

The useMemo hook is used appropriately to memoize the isConcentrated state based on config.poolType.

47-49: LGTM!

The onRequestClose logic correctly resets the current step if the pool type is concentrated.

52-54: LGTM!

The onRequestBack logic is appropriately set based on whether the pool type is concentrated.

55-56: LGTM!

The title and hideCloseButton properties are appropriately set based on whether the pool type is concentrated.

57-60: LGTM!

The className is appropriately set based on whether the pool type is concentrated, using classnames.

71-88: LGTM!

The CreateCLPool component is appropriately conditionally rendered based on the pool type and current step.

89-108: LGTM!

The other steps (Step1SetRatios, Step2AddLiquidity, Step3Confirm) are appropriately conditionally rendered based on the current step.

packages/web/components/complex/pool/create/select-type.tsx (3)

14-17: LGTM!

The PoolTypeConfig interface is well-defined and appropriate for the intended use.

30-52: LGTM!

The getTypeConfig function is well-implemented and uses useCallback appropriately to memoize the function. Note the TODO comment for i18n.

59-89: LGTM!

The pool type buttons are appropriately rendered based on the types provided and use the getTypeConfig function to get the configuration.

packages/web/components/complex/pool/create/cl-pool.tsx (5)

1-9: LGTM!

The new imports are appropriate for the added functionality in the CreateCLPool component.

10-18: LGTM!

The CreateCLPoolProps interface is well-defined and appropriate for the intended use.

20-37: LGTM!

The SelectionToken type and USDC_ASSET constant are well-defined and appropriate for the intended use.

39-116: LGTM!

The CreateCLPool component is well-implemented and integrates well with the existing project structure.

121-129: LGTM!

The getStepHeader function is well-implemented and ensures that the correct header is displayed for each step.

packages/web/components/complex/pool/create/cl/add-initial-liquidity.tsx (5)

1-16: LGTM!

The new imports are appropriate for the added functionality in the AddInitialLiquidity component.

17-22: LGTM!

The AddInitialLiquidityProps interface is well-defined and appropriate for the intended use.

24-24: LGTM!

The isAmountValid function is well-implemented and appropriate for the intended use.

26-168: LGTM!

The AddInitialLiquidity component is well-implemented and integrates well with the existing project structure.

172-254: LGTM!

The TokenLiquiditySelector component is well-implemented and integrates well with the existing project structure.

packages/web/components/complex/pool/create/cl/set-base-info.tsx (7)

1-27: Imports look good!

The imports are well-organized and necessary for the functionality implemented in this file.

30-37: Interface definition looks good!

The SetBaseInfosProps interface is well-defined, covering all necessary properties for the SetBaseInfos component.

39-242: Component implementation looks good!

The SetBaseInfos component is well-implemented, handling the selection of base and quote tokens, setting the swap fee, and managing the transaction state effectively.

245-249: Interface definition looks good!

The TokenSelectorProps interface is well-defined, covering all necessary properties for the TokenSelector component.

251-314: Component implementation looks good!

The TokenSelector component is well-implemented, handling the token selection process effectively.

316-320: Interface definition looks good!

The SpreadSelectorProps interface is well-defined, covering all necessary properties for the SpreadSelector component.

322-375: Component implementation looks good!

The SpreadSelector component is well-implemented, handling the selection of spread factors effectively.

packages/stores/src/account/osmosis/index.ts (2)

11-11: Imports look good!

The imports from @osmosis-labs/math are necessary for the new functionality implemented in this file.

749-786: Method implementation looks good!

The sendCreateConcentratedLiquidityInitialFullRangePositionMsg method is well-implemented, handling the creation of a concentrated liquidity position effectively.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share
Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai generate interesting stats about this repository and render them as a table.
    • @coderabbitai show all the console.log statements in this repository.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@fabryscript fabryscript changed the title Implement modal for CL Pool Implement modal for Concentrated Liquidity Pool creation Jul 6, 2024
@vercel Vercel
Copy link

vercel bot commented Jul 7, 2024 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
osmosis-frontend ❌ Failed (Inspect) Jul 7, 2024 2:10pm

@sunnya97
Copy link
Collaborator

sunnya97 commented Jul 9, 2024

Build failed

@sunnya97 sunnya97 changed the base branch from stage to fabryscript/cl-pool-creation July 10, 2024 15:54
@sunnya97 sunnya97 merged commit 9d6ba66 into osmosis-labs:fabryscript/cl-pool-creation Jul 10, 2024
1 of 6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@fabryscript fabryscript

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@fabryscript @sunnya97