Skip to content

Instantly share code, notes, and snippets.

@yannvr
Last active June 25, 2024 11:35
Show Gist options
  • Save yannvr/b93916448f21844b4a9bf7208a48593c to your computer and use it in GitHub Desktop.
Save yannvr/b93916448f21844b4a9bf7208a48593c to your computer and use it in GitHub Desktop.
dynamic import of validation and submit objects
import type { ChangeEvent, ReactNode } from "react";
import { Button, Typography } from "@mui/material";
import type { EnhancedStore } from "@reduxjs/toolkit";
import notices from "@contracts/trumatic/notices.json";
import type { TokenSymbol } from "@interfaces/shared-types";
import formSlice from "@store/form/form.reducer";
import { selectUserStakingTokenBalance, selectUserStakerSummary } from "@store/staker/staker.selectors";
import { trimInputValue } from "@utils/helpers/forms/trim-input-values";
import { validateAllocationAmount } from "./form-validation/trustake-common.validation";
import { formSubmitActions, formValidationActions } from "./submit-actions/trustake-form-submit-actions";
import type { FormFields, FormMethods } from "./trustake-form.utils";
import { selectSelectedStaker } from "@store/global/global.reducer";
let store: EnhancedStore;
export const injectStoreToTrustakeForm = (_store: EnhancedStore) => {
store = _store;
};
/***** EXAMPLE OF DYNAMIC INTEGRATION OF ASSET OVERRIDES (Submit, Validate) for deposit ***/
const getStakingToken = (): string => {
const state = store.getState();
return selectSelectedStaker(state).toLowerCase();
};
export const getFieldValidation = async (formName: string) => {
const stakingToken = getStakingToken();
try {
// trustake-form.[asset].validation.ts needs to be an object
const validation = await import(`./trustake-form.${stakingToken}.validation`);
return validation;
} catch (error) {
console.error("Failed to load validation module:", error);
throw new Error("Validation module not found");
}
};
export const getSubmit = async (formName: string) => {
const stakingToken = getStakingToken();
try {
// trustake-form.[asset].submit.ts needs to be an object
const submit = await import(`./submit-actions/trustake-form.${stakingToken}.submit`);
return submit[formName];
} catch (error) {
console.error("Failed to load submission module:", error);
throw new Error("Submission module not found");
}
};
export const trustakeForm = (stakingToken: TokenSymbol): Record<FormMethods, FormFields> => ({
deposit: () => {
return {
name: "Deposit",
description: notices.deposit,
isModal: false,
fields: [
{
name: "amount",
type: "text",
label: "Enter amount",
required: true,
endAdornment: (
<Button
variant="tertiary"
onClick={() => {
const { availableToStake } = selectUserStakingTokenBalance(store.getState());
const isAvailableTostakeZero = +availableToStake === 0 || availableToStake === "-";
store.dispatch(
formSlice.actions.setInputValueAction({
name: "amount",
value: trimInputValue(isAvailableTostakeZero ? "0" : availableToStake),
}),
);
}}
sx={{ alignSelf: "center" }}
>
Max
</Button>
),
isFieldValid: getFieldValidation("deposit"),
onChange: (e: ChangeEvent<HTMLInputElement>) =>
store.dispatch(
formSlice.actions.setInputValueAction({ name: "amount", value: trimInputValue(e.target.value) }),
),
},
],
onSubmit: getSubmit("deposit"),
};
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment