Merge pull request #1136 from emarc99/fix-1134

Fix: Subscription page button

Author: Marchand-Nicolas

README.md

@@ -8,14 +8,16 @@ Enabling users to:
 - Manage and monitor their starknet identities and domains
 - Make calls to the starknet id serverless API
 
-## Prerequisite 🌴 
-You should install a browser extension for any of these wallets below: 
+## Prerequisite 🌴
+
+You should install a browser extension for any of these wallets below:
+
 - ArgentX (Recommended)
 - Metamask
 - Bravoos
 - OKX
 - Bitget
-- Keplr 
+- Keplr
 
 ![](/public/visuals/wallets.webp)
 
@@ -24,7 +26,7 @@ To learn how to add browser extensions, go [here](https://support.google.com/chr
 Once wallet extension of your choice is installed and properly setup, switch to sepolia testnet for development purposes.
 Request for testnet STRK tokens [here](https://sepolia.app.starknet.id) to pay for gas (transaction fees)
 
-## How to use 🌴 
+## How to use 🌴
 
 First step, clone this repo.
 
@@ -48,16 +50,15 @@ npm install --force
 yarn install --force
 ```
 
-## Setting up Development Server for testnet 🌴 
+## Setting up Development Server for testnet 🌴
 
 - In the root of your project, create a `.env.local` file.
 - Copy all the content in `.env.test` into your newly created file.
 - Go to [here](https://sepolia.app.starknet.id/) and mint your domains.
 
 **NB**: longer domain names cost less.
 
-
-## Setting up Development Server for mainnet 🌴 
+## Setting up Development Server for mainnet 🌴
 
 - In the root of your project, create a `.env.local` file.
 - Copy all the content in `.env.example` into your newly created file
@@ -76,7 +77,6 @@ Lastly, connect your wallet (e.g ArgentX, ensure its in testnet mode if you want
 
 **NB:** You need to have mainnet token balance to pay for gas fees if you are using mainnet.
 
-
 ## License 🌴
 
 Currently there is no license, this means you cannot modify or redistribute this code without explicit permission from the copyright holder.

hooks/useNeedAllowances.tsx

@@ -51,9 +51,9 @@ export default function useNeedsAllowances(
             Hardcoded: hash.getSelectorFromName("allowance"),
           }),
           calldata: [
-            new CairoCustomEnum({ Hardcoded: address }), // owner
+            new CairoCustomEnum({ Hardcoded: address ?? "0x0" }), // owner
             new CairoCustomEnum({
-              Hardcoded: AutoRenewalContracts[currencyNames[index]],
+              Hardcoded: AutoRenewalContracts[currencyNames[index]] ?? "0x0",
             }), // spender
           ],
         });

pages/subscription.tsx

@@ -3,10 +3,11 @@ import type { NextPage } from "next";
 import homeStyles from "../styles/Home.module.css";
 import styles from "../styles/search.module.css";
 import AutoRenewal from "../components/domains/autorenewal";
+import registerV2Styles from "../styles/components/registerV2.module.css";
 
 const AutoRenewalPage: NextPage = () => {
   return (
-    <div className={homeStyles.screen}>
+    <div className={`${homeStyles.screen} ${registerV2Styles.subscriptionScreen}`}>
       <div className={styles.container}>
         <AutoRenewal />
       </div>

styles/components/registerV2.module.css

@@ -4,13 +4,13 @@
   max-width: 100%;
   background-color: white;
   justify-content: space-between;
-  margin-bottom: 100px;
   border-radius: 1rem;
   box-shadow: 0px 2px 30px 0px rgba(0, 0, 0, 0.06);
   margin-bottom: 3rem;
   overflow: hidden;
   position: relative;
   z-index: 0;
+  margin-top: 1rem;
 }
 
 .card {
@@ -25,6 +25,11 @@
   background-color: #fff;
 }
 
+.subscriptionScreen {
+  height: auto;
+  min-height: 88vh;
+}
+
 .price {
   color: rgb(31 41 55);
   font-size: 1.25rem /* 20px */;

styles/search.module.css

@@ -15,6 +15,7 @@
   .container {
     flex-direction: column;
     min-height: auto;
+    padding-bottom: 10px;
   }
 }