-
Notifications
You must be signed in to change notification settings - Fork 70
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
15 changed files
with
357 additions
and
82 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
11 changes: 11 additions & 0 deletions
11
apps/marginfi-v2-ui/src/components/common/icons/PieChart.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import React, { FC, HTMLProps } from "react"; | ||
|
|
||
| const PieChart: FC<HTMLProps<HTMLDivElement>> = ({ color = "#868E95", ...props }) => ( | ||
| <div {...props}> | ||
| <svg fill={color} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M11 2.04932V12.9999H21.9506C21.4489 18.0533 17.1853 21.9999 12 21.9999C6.47715 21.9999 2 17.5228 2 11.9999C2 6.81459 5.94668 2.55104 11 2.04932ZM13 2.04932C17.7244 2.51839 21.4816 6.27552 21.9506 10.9999H13V2.04932Z" /> | ||
| </svg> | ||
| </div> | ||
| ); | ||
|
|
||
| export { PieChart }; |
16 changes: 16 additions & 0 deletions
16
apps/marginfi-v2-ui/src/components/common/icons/ReceiveMoney.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| import React, { FC, HTMLProps } from "react"; | ||
|
|
||
| const ReceiveMoney: FC<HTMLProps<HTMLDivElement>> = ({ color = "#868E95", ...props }) => ( | ||
| <div {...props}> | ||
| <svg fill={color} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> | ||
| <g transform="translate(0,0)"> | ||
| <path | ||
| d="M258 21.89c-.5 0-1.2 0-1.8.12-4.6.85-10.1 5.1-13.7 14.81-3.8 9.7-4.6 23.53-1.3 38.34 3.4 14.63 10.4 27.24 18.2 34.94 7.6 7.7 14.5 9.8 19.1 9 4.8-.7 10.1-5.1 13.7-14.7 3.8-9.64 4.8-23.66 1.4-38.35-3.5-14.8-10.4-27.29-18.2-34.94-6.6-6.8-12.7-9.22-17.4-9.22zM373.4 151.4c-11 .3-24.9 3.2-38.4 8.9-15.6 6.8-27.6 15.9-34.2 24.5-6.6 8.3-7.2 14.6-5.1 18.3 2.2 3.7 8.3 7.2 20 7.7 11.7.7 27.5-2.2 43-8.8 15.5-6.7 27.7-15.9 34.3-24.3 6.6-8.3 7.1-14.8 5-18.5-2.1-3.8-8.3-7.1-20-7.5-1.6-.3-3-.3-4.6-.3zm-136.3 92.9c-6.6.1-12.6.9-18 2.3-11.8 3-18.6 8.4-20.8 14.9-2.5 6.5 0 14.3 7.8 22.7 8.2 8.2 21.7 16.1 38.5 20.5 16.7 4.4 32.8 4.3 44.8 1.1 12.1-3.1 18.9-8.6 21.1-15 2.3-6.5 0-14.2-8.1-22.7-7.9-8.2-21.4-16.1-38.2-20.4-9.5-2.5-18.8-3.5-27.1-3.4zm160.7 58.1L336 331.7c4.2.2 14.7.5 14.7.5l6.6 8.7 54.7-28.5-14.2-10zm-54.5.1l-57.4 27.2c5.5.3 18.5.5 23.7.8l49.8-23.6-16.1-4.4zm92.6 10.8l-70.5 37.4 14.5 18.7 74.5-44.6-18.5-11.5zm-278.8 9.1a40.33 40.33 0 0 0-9 1c-71.5 16.5-113.7 17.9-126.2 17.9H18v107.5s11.6-1.7 30.9-1.8c37.3 0 103 6.4 167 43.8 3.4 2.1 10.7 2.9 19.8 2.9 24.3 0 61.2-5.8 69.7-9C391 452.6 494 364.5 494 364.5l-32.5-28.4s-79.8 50.9-89.9 55.8c-91.1 44.7-164.9 16.8-164.9 16.8s119.9 3 158.4-27.3l-22.6-34s-82.8-2.3-112.3-6.2c-15.4-2-48.7-18.8-73.1-18.8z" | ||
| fill-opacity="1" | ||
| ></path> | ||
| </g> | ||
| </svg> | ||
| </div> | ||
| ); | ||
|
|
||
| export { ReceiveMoney }; |
11 changes: 11 additions & 0 deletions
11
apps/marginfi-v2-ui/src/components/common/icons/TokenSwap.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import React, { FC, HTMLProps } from "react"; | ||
|
|
||
| const TokenSwap: FC<HTMLProps<HTMLDivElement>> = ({ color = "#868E95", ...props }) => ( | ||
| <div {...props}> | ||
| <svg fill={color} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M21.5 9C21.5 11.7039 19.849 14.0223 17.5 15.0018L17.5 15C17.5 10.3056 13.6944 6.5 9.00001 6.5L8.99817 6.5C9.97773 4.15105 12.2961 2.5 15 2.5C18.5899 2.5 21.5 5.41015 21.5 9ZM7 3C4.79086 3 3 4.79086 3 7V8.5H5V7C5 5.89543 5.89543 5 7 5H8.5V3H7ZM19 15.5V17C19 18.1046 18.1046 19 17 19H15.5V21H17C19.2091 21 21 19.2091 21 17V15.5H19ZM9 21.5C12.5899 21.5 15.5 18.5899 15.5 15C15.5 11.4101 12.5899 8.5 9 8.5C5.41015 8.5 2.5 11.4101 2.5 15C2.5 18.5899 5.41015 21.5 9 21.5ZM9 12.5L11.5 15L9 17.5L6.5 15L9 12.5Z" /> | ||
| </svg> | ||
| </div> | ||
| ); | ||
|
|
||
| export { TokenSwap }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| export * from "./PieChart" | ||
| export * from "./ReceiveMoney" | ||
| export * from "./TokenSwap" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| import { FC, HTMLProps } from "react"; | ||
| import {PieChart, ReceiveMoney, TokenSwap} from "~/components/common/icons"; | ||
|
|
||
| export interface NavLinkInfo { | ||
| href: string; | ||
| alt: string; | ||
| label: string; | ||
| Icon: FC<HTMLProps<HTMLDivElement>>; | ||
| } | ||
|
|
||
| export const ORDERED_MOBILE_NAVBAR_LINKS: NavLinkInfo[] = [ | ||
| { | ||
| href: "/", | ||
| alt: "hand with money icon", | ||
| label: "lend", | ||
| Icon: ReceiveMoney, | ||
| }, | ||
| { | ||
| href: "/stake", | ||
| alt: "coin swap icon", | ||
| label: "stake", | ||
| Icon: TokenSwap, | ||
| }, | ||
| { | ||
| href: "/portfolio", | ||
| alt: "pie chart icon", | ||
| label: "portfolio", | ||
| Icon: PieChart, | ||
| }, | ||
| ]; | ||
|
|
||
| export const ORDERED_MOBILE_LAUNCHER_LINKS: NavLinkInfo[] = [ | ||
| { | ||
| href: "/", | ||
| alt: "hand with money icon", | ||
| label: "lend", | ||
| Icon: ReceiveMoney, | ||
| }, | ||
| { | ||
| href: "/stake", | ||
| alt: "coin swap icon", | ||
| label: "stake", | ||
| Icon: TokenSwap, | ||
| }, | ||
| { | ||
| href: "/portfolio", | ||
| alt: "pie chart icon", | ||
| label: "portfolio", | ||
| Icon: PieChart, | ||
| }, | ||
| ]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| import { useState, useEffect } from "react"; | ||
|
|
||
| export function useSwipeGesture(cb: () => void) { | ||
| const [startTouchX, setStartTouchX] = useState<number | null>(null); | ||
|
|
||
| useEffect(() => { | ||
| const handleTouchStart = (e: TouchEvent) => { | ||
| if (e.touches[0].clientX < 20) { | ||
| // 20px is an arbitrary width from the left | ||
| setStartTouchX(e.touches[0].clientX); | ||
| } | ||
| }; | ||
|
|
||
| const handleTouchEnd = (e: TouchEvent) => { | ||
| const endTouchX = e.changedTouches[0].clientX; | ||
|
|
||
| // If the touch ends more than 50 pixels from where it started, call the callback | ||
| if (startTouchX && endTouchX - startTouchX > 50) { | ||
| cb(); | ||
| } | ||
|
|
||
| // Reset the starting touch position | ||
| setStartTouchX(null); | ||
| }; | ||
|
|
||
| // Attach the event listeners | ||
| document.addEventListener("touchstart", handleTouchStart); | ||
| document.addEventListener("touchend", handleTouchEnd); | ||
|
|
||
| return () => { | ||
| // Clean up the event listeners | ||
| document.removeEventListener("touchstart", handleTouchStart); | ||
| document.removeEventListener("touchend", handleTouchEnd); | ||
| }; | ||
| }, [startTouchX, cb]); | ||
|
|
||
| return; // this hook doesn't need to return anything, but you can return values if needed | ||
| } |
Oops, something went wrong.