Knip (#3925)

* Closes FE-1188

* Closes FE-1009

* lowercase open orders

* hide nav bar title

* optimize rendering

* SSR swap tool

* clean up limit order ff & bg

* remove old swap tool code

* add knip JSON

* knip & lint

* fix translations test

* fix packages

* fix

* clean up localizations

packages/web/__tests__/test-utils.tsx

@@ -2,6 +2,7 @@
 import { WalletStatus } from "@cosmos-kit/core";
 import { superjson } from "@osmosis-labs/server";
 import { AccountStore } from "@osmosis-labs/stores";
+import type { AvailableFlags } from "@osmosis-labs/types";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { Queries, render, RenderHookOptions } from "@testing-library/react";
 import { renderHook } from "@testing-library/react";
@@ -12,17 +13,16 @@ import { ReactNode } from "react";
 
 import { TestWallet, testWalletInfo } from "~/__tests__/test-wallet";
 import { MultiLanguageProvider } from "~/hooks/language/context";
-import { AvailableFlags } from "~/hooks/use-feature-flags";
 import { WalletSelectProvider } from "~/hooks/use-wallet-select";
 import { AppRouter } from "~/server/api/root-router";
 import { storeContext, StoreProvider } from "~/stores";
 import { RootStore } from "~/stores/root";
 
-export const trpcReact = createTRPCReact<AppRouter>();
+const trpcReact = createTRPCReact<AppRouter>();
 let testRootStore: RootStore;
 
 const queryClient = new QueryClient();
-export const withTRPC = ({ children }: { children?: ReactNode }) => {
+const withTRPC = ({ children }: { children?: ReactNode }) => {
   return (
     <MultiLanguageProvider defaultLanguage="en">
       <StoreProvider>

packages/web/components/ad-banner/ad-banner.tsx

@@ -7,7 +7,7 @@ import { Icon } from "~/components/assets";
 import { Step, Stepper } from "~/components/stepper/index";
 import { useTranslation } from "~/hooks";
 
-export type Ad = SwapAdBannerResponse["banners"][number] & {
+type Ad = SwapAdBannerResponse["banners"][number] & {
   onClick?: () => void;
 };
 interface AdBannersProps {

packages/web/components/alert/cypher-card-toast.tsx

@@ -11,7 +11,7 @@ import { Pill } from "~/components/indicators/pill";
 import { IconButton } from "~/components/ui/button";
 import { Breakpoint, useTranslation, useWindowSize } from "~/hooks";
 
-export const CypherCardFloatingBannerDoNotShowKey =
+const CypherCardFloatingBannerDoNotShowKey =
   "cypher-card-floating-banner-do-not-show";
 
 export function CypherCardToast() {

packages/web/components/alert/toast.tsx

@@ -14,7 +14,7 @@ import { Button } from "~/components/buttons";
 import { Checkbox } from "~/components/ui/checkbox";
 import { t } from "~/hooks";
 
-export type ToastOptions = Partial<ReactToastifyOptions> & {
+type ToastOptions = Partial<ReactToastifyOptions> & {
   updateToastId?: Id;
 };
 
@@ -221,7 +221,7 @@ const OneClickTradingToast: FunctionComponent<Alert> = ({
 export const AlloyedAssetsToastDoNotShowKey =
   "do-not-show-alloyed-assets-toast";
 
-export const AlloyedAssetsToast: FunctionComponent<
+const AlloyedAssetsToast: FunctionComponent<
   Alert & { closeToast: () => void }
 > = ({ titleTranslationKey, captionTranslationKey, closeToast }) => {
   const [, setDoNotShowAgain] = useLocalStorage(

packages/web/components/assets/highlights-categories.tsx

@@ -129,7 +129,7 @@ function highlightUpcomingReleaseAsset(asset: UpcomingReleaseAsset) {
   };
 }
 
-export const AssetHighlights: FunctionComponent<
+const AssetHighlights: FunctionComponent<
   {
     title: string;
     subtitle?: string;

packages/web/components/bridge/bridge-wallet-select-modal.tsx

@@ -95,7 +95,7 @@ enum WalletSelectScreens {
   SendToAnotherAddress = "send-to-another-address",
 }
 
-export const BridgeWalletSelectScreens: FunctionComponent<
+const BridgeWalletSelectScreens: FunctionComponent<
   BridgeWalletSelectProps & {
     onClose: () => void;
     setRemoveMinHeight?: (nextValue: boolean) => void;

packages/web/components/bridge/deposit-address-screen.tsx

@@ -488,7 +488,7 @@ const TransferDetails: FunctionComponent<{
   );
 };
 
-export const EstimatedTimeRow: FunctionComponent<{
+const EstimatedTimeRow: FunctionComponent<{
   depositData: RouterOutputs["bridgeTransfer"]["getDepositAddress"]["depositData"];
   isRefetchingQuote: boolean;
 }> = ({ depositData, isRefetchingQuote }) => {
@@ -509,7 +509,7 @@ export const EstimatedTimeRow: FunctionComponent<{
   );
 };
 
-export const ProviderFeesRow: FunctionComponent<{
+const ProviderFeesRow: FunctionComponent<{
   depositData: RouterOutputs["bridgeTransfer"]["getDepositAddress"]["depositData"];
   isRefetchingQuote: boolean;
 }> = ({ depositData, isRefetchingQuote }) => {
@@ -524,7 +524,7 @@ export const ProviderFeesRow: FunctionComponent<{
   );
 };
 
-export const NetworkFeeRow: FunctionComponent<{
+const NetworkFeeRow: FunctionComponent<{
   depositData: RouterOutputs["bridgeTransfer"]["getDepositAddress"]["depositData"];
   isRefetchingQuote: boolean;
   fromChainName?: string;

packages/web/components/buttons/button.tsx

@@ -4,7 +4,7 @@ import { ButtonHTMLAttributes, forwardRef } from "react";
 import { Spinner } from "~/components/loaders";
 import { CustomClasses } from "~/components/types";
 
-export const buttonCVA = cva(
+const buttonCVA = cva(
   "flex w-full group place-content-center items-center py-2 text-center transition-colors disabled:cursor-default",
   {
     variants: {

packages/web/components/chart/concentrated-liquidity-depth.tsx

@@ -14,7 +14,7 @@ import React, { FunctionComponent } from "react";
 
 import { theme } from "~/tailwind.config";
 
-export type DepthData = {
+type DepthData = {
   price: number;
   depth: number;
 };

packages/web/components/chart/light-weight-charts/chart-controller.ts

@@ -27,11 +27,7 @@ export interface ChartControllerParams<
   onCrosshairMove?: (param: MouseEventParams<K>) => void;
 }
 
-export type ChartControllerEvents<
-  T = TimeChartOptions,
-  K = Time,
-  N = Series
-> = {
+type ChartControllerEvents<T = TimeChartOptions, K = Time, N = Series> = {
   crosshairMove: (param: MouseEventParams<K>) => void;
   init: (params: ChartControllerParams<T, K, N>) => void;
   remove: (params: ChartControllerParams<T, K, N>) => void;

packages/web/components/chart/light-weight-charts/chart.tsx

@@ -38,7 +38,7 @@ function resizeSubscribe(callback: (this: Window, ev: UIEvent) => unknown) {
   };
 }
 
-export const defaultOptions: DeepPartial<TimeChartOptions> = {
+const defaultOptions: DeepPartial<TimeChartOptions> = {
   layout: {
     fontFamily: theme.fontFamily.caption.join(","),
     background: {
@@ -189,7 +189,7 @@ const defaultOptionsWithSeries = (
   },
 });
 
-export interface ChartProps<T extends TimeChartOptions, K extends Time> {
+interface ChartProps<T extends TimeChartOptions, K extends Time> {
   options?: DeepPartial<T>;
   series?: Series[];
   Controller: new (

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

@@ -10,9 +10,9 @@ import { IS_TESTNET, SpriteIconId } from "~/config";
 import { useTranslation } from "~/hooks";
 import { useStore } from "~/stores";
 
-export type PoolType = ObservableQueryPool["type"];
+type PoolType = ObservableQueryPool["type"];
 
-export interface PoolTypeConfig {
+interface PoolTypeConfig {
   imageSrc: string;
   caption: string;
   iconId?: SpriteIconId;

packages/web/components/complex/pools-table.tsx

@@ -31,7 +31,7 @@ import { api, RouterOutputs } from "~/utils/trpc";
 
 import { Tooltip } from "../tooltip";
 
-export type Pool = RouterOutputs["edge"]["pools"]["getPools"]["items"][number];
+type Pool = RouterOutputs["edge"]["pools"]["getPools"]["items"][number];
 /** UI doesn't support cosmwasm pools as first class so exclude it from list of filter options. */
 export type PoolTypeFilter = Exclude<Pool["type"], "cosmwasm">;
 export type PoolIncentiveFilter = NonNullable<
@@ -55,7 +55,7 @@ export const marketIncentivePoolsSortKeys = [
   "incentives.aprBreakdown.total.upper",
 ] as const;
 
-export type MarketIncentivePoolsSortKey =
+type MarketIncentivePoolsSortKey =
   (typeof marketIncentivePoolsSortKeys)[number];
 
 export const incentiveTypes: PoolIncentiveFilter[] = [
@@ -77,7 +77,7 @@ export interface PoolsTabelSortParams {
   allPoolsSortDir: SortDirection;
 }
 
-export interface PoolsTableProps {
+interface PoolsTableProps {
   topOffset?: number;
   quickAddLiquidity?: (poolId: string) => void;
   limit?: number;
@@ -500,11 +500,11 @@ export const PoolsTable = (props: PropsWithChildren<PoolsTableProps>) => {
   );
 };
 
-export type PoolCellComponent<TProps = {}> = FunctionComponent<
+type PoolCellComponent<TProps = {}> = FunctionComponent<
   CellContext<Pool, Pool> & TProps
 >;
 
-export const PoolCompositionCell: PoolCellComponent = ({
+const PoolCompositionCell: PoolCellComponent = ({
   row: {
     original: { id, type, spreadFactor, reserveCoins },
   },
@@ -577,7 +577,7 @@ export const PoolCompositionCell: PoolCellComponent = ({
   );
 };
 
-export function getPoolLink(pool: Pool): string {
+function getPoolLink(pool: Pool): string {
   if (pool.type === "cosmwasm-transmuter") {
     return `https://celatone.osmosis.zone/osmosis-1/pools/${pool.id}`;
   }
@@ -592,7 +592,7 @@ export function getPoolLink(pool: Pool): string {
   return `/pool/${pool.id}`;
 }
 
-export function getPoolTypeTarget(pool: Pool) {
+function getPoolTypeTarget(pool: Pool) {
   if (
     pool.type === "cosmwasm-transmuter" ||
     pool.type === "cosmwasm-astroport-pcl" ||
@@ -603,7 +603,7 @@ export function getPoolTypeTarget(pool: Pool) {
   return "";
 }
 
-export const AprBreakdownCell: PoolCellComponent = ({
+const AprBreakdownCell: PoolCellComponent = ({
   row: {
     original: { incentives },
   },

packages/web/components/complex/portfolio/allocation-tabs.tsx

@@ -4,7 +4,8 @@ import { FunctionComponent, useMemo } from "react";
 import { useTranslation } from "~/hooks";
 
 import { AllocationOptions } from "./types";
-export interface AllocationTabProps {
+
+interface AllocationTabProps {
   setTab: (tab: AllocationOptions) => void;
   activeTab: AllocationOptions;
 }

packages/web/components/control/index.ts

@@ -3,7 +3,6 @@ export * from "./language-select";
 export * from "./menu-dropdown";
 export * from "./menu-toggle";
 export * from "./radio";
-export * from "./sort-menu";
 export * from "./stake-tab";
 export * from "./token-select";
 export * from "./types";

packages/web/components/control/language-select.tsx

@@ -9,7 +9,7 @@ import { useTranslation } from "~/hooks";
 import { useStore } from "~/stores";
 import { LanguageUserSetting } from "~/stores/user-settings";
 
-export type LanguageSelectProps = {
+type LanguageSelectProps = {
   options: { value: string; display: string }[];
 };
 

packages/web/components/control/types.ts

@@ -1,7 +1,5 @@
 import { ReactNode } from "react";
 
-import { InputProps } from "~/components/types";
-
 export interface ToggleProps<T = boolean> {
   isOn: boolean;
   onToggle: (value: T) => void;
@@ -19,11 +17,6 @@ export interface MenuSelectProps {
   onSelect: (optionId: string) => void;
 }
 
-export interface NumberSelectProps extends InputProps<number> {
-  min: number;
-  max: number;
-}
-
 export interface MenuDropdownIconItemProps {
   value: string;
   display: string;