removed redirects for web3, needs dialog in booking page (#1700)

* removed redirects, better: ask for verification in follow up pr for event-type pages

* fuck ts honestly

* ignoring type issues lol

components/booking/pages/AvailabilityPage.tsx

@@ -1,7 +1,6 @@
 // Get router variables
 import { ChevronDownIcon, ChevronUpIcon, ClockIcon, CreditCardIcon, GlobeIcon } from "@heroicons/react/solid";
 import * as Collapsible from "@radix-ui/react-collapsible";
-import { useContracts } from "contexts/contractsContext";
 import dayjs, { Dayjs } from "dayjs";
 import customParseFormat from "dayjs/plugin/customParseFormat";
 import utc from "dayjs/plugin/utc";
@@ -37,16 +36,6 @@ const AvailabilityPage = ({ profile, eventType, workingHours }: Props) => {
   const { rescheduleUid } = router.query;
   const { isReady } = useTheme(profile.theme);
   const { t } = useLocale();
-  const { contracts } = useContracts();
-
-  useEffect(() => {
-    if (eventType.metadata.smartContractAddress) {
-      const eventOwner = eventType.users[0];
-      if (!contracts[(eventType.metadata.smartContractAddress || null) as number])
-        router.replace(`/${eventOwner.username}`);
-    }
-  }, [contracts, eventType.metadata.smartContractAddress, router]);
-
   const selectedDate = useMemo(() => {
     const dateString = asStringOrNull(router.query.date);
     if (dateString) {

components/booking/pages/BookingPage.tsx

@@ -59,28 +59,7 @@ const BookingPage = (props: BookingPageProps) => {
   const { t, i18n } = useLocale();
   const router = useRouter();
   const { contracts } = useContracts();
-
   const { eventType } = props;
-  useEffect(() => {
-    if (eventType.metadata.smartContractAddress) {
-      const eventOwner = eventType.users[0];
-
-      if (!contracts[(eventType.metadata.smartContractAddress || null) as number])
-        router.replace(`/${eventOwner.username}`);
-    }
-  }, [contracts, eventType.metadata.smartContractAddress, router]);
-
-  /*
-   * This was too optimistic
-   * I started, then I remembered what a beast book/event.ts is
-   * Gave up shortly after. One day. Maybe.
-   *
-  const mutation = trpc.useMutation("viewer.bookEvent", {
-    onSuccess: ({ booking }) => {
-      // go to success page.
-    },
-  });*/
-
   const mutation = useMutation(createBooking, {
     onSuccess: async ({ attendees, paymentUid, ...responseData }) => {
       if (paymentUid) {
@@ -248,7 +227,9 @@ const BookingPage = (props: BookingPageProps) => {
     let web3Details;
     if (eventTypeDetail.metadata.smartContractAddress) {
       web3Details = {
-        userWallet: web3.currentProvider.selectedAddress,
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        userWallet: window.web3.currentProvider.selectedAddress,
         userSignature: contracts[(eventTypeDetail.metadata.smartContractAddress || null) as number],
       };
     }
@@ -390,7 +371,7 @@ const BookingPage = (props: BookingPageProps) => {
                         <label key={i} className="block">
                           <input
                             type="radio"
-                            className="w-4 h-4 ltr:mr-2 rtl:ml-2 text-black border-gray-300 location focus:ring-black"
+                            className="w-4 h-4 text-black border-gray-300 ltr:mr-2 rtl:ml-2 location focus:ring-black"
                             {...bookingForm.register("locationType", { required: true })}
                             value={location.type}
                             defaultChecked={selectedLocation === location.type}
@@ -410,6 +391,8 @@ const BookingPage = (props: BookingPageProps) => {
                         {t("phone_number")}
                       </label>
                       <div className="mt-1">
+                        {/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
+                        {/* @ts-ignore */}
                         <PhoneInput name="phone" placeholder={t("enter_phone_number")} id="phone" required />
                       </div>
                     </div>
@@ -466,7 +449,7 @@ const BookingPage = (props: BookingPageProps) => {
                                 required: input.required,
                               })}
                               id={"custom_" + input.id}
-                              className="w-4 h-4 ltr:mr-2 rtl:ml-2 text-black border-gray-300 rounded focus:ring-black"
+                              className="w-4 h-4 text-black border-gray-300 rounded ltr:mr-2 rtl:ml-2 focus:ring-black"
                               placeholder=""
                             />
                             <label
@@ -540,7 +523,7 @@ const BookingPage = (props: BookingPageProps) => {
                       placeholder={t("share_additional_notes")}
                     />
                   </div>
-                  <div className="flex items-start rtl:space-x-reverse space-x-2">
+                  <div className="flex items-start space-x-2 rtl:space-x-reverse">
                     <Button type="submit" loading={mutation.isLoading}>
                       {rescheduleUid ? t("reschedule") : t("confirm")}
                     </Button>

ee/components/web3/CryptoSection.tsx

@@ -17,7 +17,6 @@ interface Window {
   ethereum: any;
   web3: Web3;
 }
-
 interface EvtsToVerify {
   [eventId: string]: boolean;
 }
@@ -53,7 +52,7 @@ const CryptoSection = (props: CryptoSectionProps) => {
   const verifyWallet = useCallback(async () => {
     try {
       if (!window.web3) {
-        throw new Error("MetaMask Chrome extension is not installed");
+        throw new Error("MetaMask browser extension is not installed");
       }
 
       const contract = new window.web3.eth.Contract(genericAbi as AbiItem[], props.smartContractAddress);
@@ -64,9 +63,13 @@ const CryptoSection = (props: CryptoSectionProps) => {
       if (!hasToken) {
         throw new Error("Specified wallet does not own any tokens belonging to this smart contract");
       } else {
-        const account = (await web3.eth.getAccounts())[0];
+        const account = (await window.web3.eth.getAccounts())[0];
 
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
         const signature = await window.web3.eth.personal.sign(AUTH_MESSAGE, account);
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
         addContract({ address: props.smartContractAddress, signature });
 
         await verifyAccount(signature, account);

lib/types/booking.ts

@@ -8,6 +8,10 @@ export type BookingConfirmBody = {
 export type BookingCreateBody = {
   email: string;
   end: string;
+  web3Details?: {
+    userWallet: string;
+    userSignature: unknown;
+  };
   eventTypeId: number;
   guests?: string[];
   location: string;