Feat/3155 integration and support of drep handles within drep directory

CHANGELOG.md

@@ -12,6 +12,8 @@ changes.
 
 ### Added
 
+- Add support for ada handle in drep payment address [Issue 3155]()
+
 ### Fixed
 
 ### Changed

govtool/frontend/.storybook/preview.tsx

@@ -11,6 +11,7 @@ import { ModalProvider } from "../src/context/modal";
 import { CardanoProvider } from "../src/context/wallet";
 import i18n from "../src/i18n";
 import { theme } from "../src/theme";
+import { AdaHandleProvider } from "../src/context/adaHandle";
 
 const queryClient = new QueryClient();
 
@@ -29,32 +30,34 @@ const preview: Preview = {
       <QueryClientProvider client={queryClient}>
         <AppContextProvider>
           <FeatureFlagProvider>
-            <ThemeProvider theme={theme}>
-              <CardanoProvider>
-                <ModalProvider>
-                  <I18nextProvider i18n={i18n}>
-                    <MemoryRouter>
-                      <Routes>
-                        <Route
-                          path="/*"
-                          element={
-                            <div
-                              style={{
-                                margin: "0px",
-                                padding: "0px",
-                                position: "relative",
-                              }}
-                            >
-                              <Story />
-                            </div>
-                          }
-                        />
-                      </Routes>
-                    </MemoryRouter>
-                  </I18nextProvider>
-                </ModalProvider>
-              </CardanoProvider>
-            </ThemeProvider>
+            <AdaHandleProvider>
+              <ThemeProvider theme={theme}>
+                <CardanoProvider>
+                  <ModalProvider>
+                    <I18nextProvider i18n={i18n}>
+                      <MemoryRouter>
+                        <Routes>
+                          <Route
+                            path="/*"
+                            element={
+                              <div
+                                style={{
+                                  margin: "0px",
+                                  padding: "0px",
+                                  position: "relative",
+                                }}
+                              >
+                                <Story />
+                              </div>
+                            }
+                          />
+                        </Routes>
+                      </MemoryRouter>
+                    </I18nextProvider>
+                  </ModalProvider>
+                </CardanoProvider>
+              </ThemeProvider>
+            </AdaHandleProvider>
           </FeatureFlagProvider>
         </AppContextProvider>
       </QueryClientProvider>

govtool/frontend/src/context/adaHandle.tsx

@@ -0,0 +1,49 @@
+import { createContext, useContext, PropsWithChildren, useMemo } from "react";
+import { HandleObject } from "@/models/adaHandle";
+import { adaHandleService } from "@/services/AdaHandle";
+
+type AdaHandleContextType = {
+  isValidAdaHandle: (handle: string) => Promise<boolean>;
+  getAdaHandleCIP105DRepId: (handle: string) => Promise<string>;
+  getAdaHandleCIP129DRepId: (handle: string) => Promise<string>;
+  getHandleDetails: (handle: string) => Promise<HandleObject | null>;
+};
+
+const AdaHandleContext = createContext<AdaHandleContextType | null>(null);
+
+/**
+ * Provides the AdaHandle context to its children components.
+ */
+export const AdaHandleProvider = ({ children }: PropsWithChildren) => {
+  const value = useMemo<AdaHandleContextType>(
+    () => ({
+      isValidAdaHandle: adaHandleService.isValidAdaHandle,
+      getAdaHandleCIP105DRepId: adaHandleService.getAdaHandleCIP105DRepId,
+      getAdaHandleCIP129DRepId: adaHandleService.getAdaHandleCIP129DRepId,
+      getHandleDetails: adaHandleService.getHandleDetails,
+    }),
+    [adaHandleService],
+  );
+
+  return (
+    <AdaHandleContext.Provider value={value}>
+      {children}
+    </AdaHandleContext.Provider>
+  );
+};
+
+/**
+ * Custom hook that provides access to the AdaHandle context.
+ * Throws an error if used outside of an AdaHandleProvider.
+ */
+export const useAdaHandleContext = () => {
+  const context = useContext(AdaHandleContext);
+
+  if (!context) {
+    throw new Error(
+      "useAdaHandleContext must be used within an AdaHandleProvider",
+    );
+  }
+
+  return context;
+};

govtool/frontend/src/context/appContext.tsx

@@ -15,7 +15,8 @@ import {
   PROTOCOL_PARAMS_KEY,
   setItemToLocalStorage,
 } from "@/utils";
-import { EpochParams, NetworkMetrics } from "@/models";
+import { EpochParams, NetworkMetrics, Network } from "@/models";
+import { adaHandleService } from "@/services/AdaHandle";
 
 const BOOTSTRAPPING_PHASE_MAJOR = 9;
 
@@ -25,7 +26,7 @@ type AppContextType = {
   isInBootstrapPhase: boolean;
   isFullGovernance: boolean;
   networkName: string;
-  network: string;
+  network: Network;
   cExplorerBaseUrl: string;
   epochParams?: EpochParams;
   networkMetrics?: NetworkMetrics;
@@ -58,6 +59,9 @@ const AppContextProvider = ({ children }: PropsWithChildren) => {
         const { data: networkMetricsData } = await fetchNetworkMetrics();
         if (networkMetricsData) {
           setItemToLocalStorage(NETWORK_METRICS_KEY, networkMetricsData);
+
+          // Initialize ada handle service
+          adaHandleService.initialize(networkMetricsData.networkName);
         }
 
         setIsAppInitializing(false);
@@ -81,7 +85,7 @@ const AppContextProvider = ({ children }: PropsWithChildren) => {
           (networkMetrics?.networkName as keyof typeof NETWORK_NAMES) ||
             "preview"
         ],
-      network: networkMetrics?.networkName || "preview",
+      network: networkMetrics?.networkName ?? Network.preview,
       cExplorerBaseUrl:
         CEXPLORER_BASE_URLS[
           (networkMetrics?.networkName as keyof typeof NETWORK_NAMES) ||

govtool/frontend/src/context/contextProviders.tsx

@@ -5,6 +5,7 @@ import { SnackbarProvider, useSnackbar } from "./snackbar";
 import { DataActionsBarProvider } from "./dataActionsBar";
 import { FeatureFlagProvider } from "./featureFlag";
 import { GovernanceActionProvider } from "./governanceAction";
+import { AdaHandleProvider } from "./adaHandle";
 
 interface Props {
   children: React.ReactNode;
@@ -14,13 +15,15 @@ const ContextProviders = ({ children }: Props) => (
   <AppContextProvider>
     <GovernanceActionProvider>
       <FeatureFlagProvider>
-        <ModalProvider>
-          <SnackbarProvider>
-            <DataActionsBarProvider>
-              <CardanoProvider>{children}</CardanoProvider>
-            </DataActionsBarProvider>
-          </SnackbarProvider>
-        </ModalProvider>
+        <AdaHandleProvider>
+          <ModalProvider>
+            <SnackbarProvider>
+              <DataActionsBarProvider>
+                <CardanoProvider>{children}</CardanoProvider>
+              </DataActionsBarProvider>
+            </SnackbarProvider>
+          </ModalProvider>
+        </AdaHandleProvider>
       </FeatureFlagProvider>
     </GovernanceActionProvider>
   </AppContextProvider>

govtool/frontend/src/context/featureFlag.test.tsx

@@ -3,6 +3,7 @@ import { renderHook } from "@testing-library/react";
 import { FeatureFlagProvider, useFeatureFlag } from "./featureFlag";
 import { GovernanceActionType } from "@/types/governanceAction";
 import { useAppContext } from "./appContext";
+import { Network } from "@/models";
 
 vi.mock("./appContext");
 
@@ -13,7 +14,7 @@ const mockUseAppContextReturnValue = {
   isAppInitializing: false,
   isInBootstrapPhase: false,
   isFullGovernance: true,
-  network: "preview",
+  network: Network.preview,
   networkName: "preview",
   isMainnet: false,
 };

govtool/frontend/src/models/adaHandle.ts

@@ -0,0 +1,58 @@
+export type ResolvedAddresses = {
+  ada?: string;
+  eth?: string;
+  btc?: string;
+};
+
+export type Virtual = {
+  expires_time: number;
+  public_mint: boolean;
+};
+
+export type HandleObject = {
+  hex: string;
+  name: string;
+  handle_type?: "handle" | "nft_subhandle";
+  virtual?: Virtual;
+  holder: string;
+  holder_type: "wallet" | "drep";
+  image: string;
+  standard_image: string;
+  image_hash: string;
+  standard_image_hash: string;
+  length: number;
+  og?: number;
+  og_number: number;
+  rarity: string;
+  characters: string;
+  numeric_modifiers: string;
+  sub_length: number;
+  sub_rarity: string;
+  sub_characters: string;
+  sub_numeric_modifiers: string;
+  payment_key_hash: string;
+  default_in_wallet: string;
+  pfp_image: string;
+  bg_image: string;
+  pfp_asset?: string;
+  bg_asset?: string;
+  resolved_addresses: ResolvedAddresses;
+  original_address?: string;
+  version: number;
+  svg_version: string;
+  utxo: string;
+  lovelace?: number;
+  has_datum: boolean;
+  created_slot_number: number;
+  updated_slot_number: number;
+  last_update_address?: string;
+  pz_enabled?: boolean;
+  last_edited_time?: number;
+  drep?: {
+    type: "drep";
+    cred: string;
+    hex: string;
+    cip_105: string;
+    cip_129: string;
+  };
+};

govtool/frontend/src/models/api.ts

@@ -78,6 +78,14 @@ export type TransactionStatus = {
     | [];
 };
 
+export enum Network {
+  samchonet = "sanchonet",
+  preview = "preview",
+  testnet = "testnet",
+  preprod = "preprod",
+  mainnet = "mainnet",
+}
+
 export type NetworkMetrics = {
   currentTime: string;
   currentEpoch: number;
@@ -96,7 +104,7 @@ export type NetworkMetrics = {
   totalRegisteredDirectVoters: number;
   alwaysAbstainVotingPower: number;
   alwaysNoConfidenceVotingPower: number;
-  networkName: string;
+  networkName: Network;
   noOfCommitteeMembers: number;
   quorumNumerator: number;
   quorumDenominator: number;