- In your React project, install dependency:
If you're using yarn:
yarn add @interchain-ui/react
If you're using npm:
npm i @interchain-ui/react
- Setting up your root layout/ route:
| fetch("https://api.launchql.dev/graphql", { | |
| "headers": { | |
| "accept": "application/json", | |
| "accept-language": "en-US,en;q=0.9,vi-VN;q=0.8,vi;q=0.7", | |
| "authorization": "Bearer cnc_live_bt_e47yjJEYQ1kJ8kpxqbUqNG-QIkUviiRr", | |
| "cache-control": "no-cache", | |
| "content-type": "application/json", | |
| "pragma": "no-cache", | |
| "priority": "u=1, i" | |
| }, |
| /* | |
| ================================================================================ | |
| LAUNCHQL ADMIN OWNERSHIP TRANSFER SCRIPT | |
| ================================================================================ | |
| PURPOSE: | |
| Promotes an existing user to admin status and transfers comprehensive ownership | |
| of LaunchQL infrastructure resources to them. Includes transaction safety, | |
| rollback mechanisms, and detailed reporting. |
| import { useRef, useEffect, useState } from "react"; | |
| import { animateLayout } from "./animate-layout.helper"; | |
| import type { AnimateLayoutProps } from "./animate-layout.types"; | |
| useMetadata({ | |
| rsc: { | |
| componentType: "client", | |
| }, | |
| }); |
| import { | |
| onMount, | |
| onUpdate, | |
| useStore, | |
| useRef, | |
| useMetadata, | |
| } from "@builder.io/mitosis"; | |
| import { animateLayout } from "./animate-layout.helper"; | |
| import type { AnimateLayoutProps } from "./animate-layout.types"; |
If you're using yarn:
yarn add @interchain-ui/react
If you're using npm:
npm i @interchain-ui/react
| import * as React from "react"; | |
| import { useMousePosition } from "~/hooks/useMousePosition"; | |
| /** Component to cover the area between the mouse cursor and the sub-menu, to allow moving cursor to lower parts of sub-menu without the sub-menu disappearing. */ | |
| export function MouseSafeArea(props: { parentRef: React.RefObject<HTMLDivElement> }) { | |
| const { x = 0, y = 0, height: h = 0, width: w = 0 } = props.parentRef.current?.getBoundingClientRect() || {}; | |
| const [mouseX, mouseY] = useMousePosition(); | |
| const positions = { x, y, h, w, mouseX, mouseY }; | |
| return ( | |
| <div |
| /** | |
| * This is the generic type useful for declaring a nominal type, | |
| * which does not structurally matches with the base type and | |
| * the other types declared over the same base type | |
| * | |
| * Usage: | |
| * @example | |
| * type Index = Nominal<number, 'Index'>; | |
| * // let i: Index = 42; // this fails to compile | |
| * let i: Index = 42 as Index; // OK |
| const minute = 60; | |
| const hour = minute * 60; | |
| const day = hour * 24; | |
| const week = day * 7; | |
| const month = day * 30; | |
| const year = day * 365; | |
| /** | |
| * Convert a date to a relative time string, such as | |
| * "a minute ago", "in 2 hours", "yesterday", "3 months ago", etc. |
type below:
brew update
brew install redis
To have launchd start redis now and restart at login:
brew services start redis