diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..b58b603
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/.idea/ai_nft_generator.iml b/.idea/ai_nft_generator.iml
new file mode 100644
index 0000000..24643cc
--- /dev/null
+++ b/.idea/ai_nft_generator.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..f4fb992
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/ai_nft_generator.iml" filepath="$PROJECT_DIR$/.idea/ai_nft_generator.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..35eb1dd
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/README.md b/README.md
index cd33847..96ae398 100644
--- a/README.md
+++ b/README.md
@@ -40,4 +40,6 @@ In a separate terminal execute:
 `$ npx hardhat run ./scripts/deploy.js --network localhost`
 
 ### 7. Start frontend
-`$ npm run start`
\ No newline at end of file
+`$ npm run start`
+
+![Alt text for the image](https://github.com/TravisLeeRichardson/ai_nft_generator/blob/dev/preview%20screen.png)
diff --git a/preview screen.png b/preview screen.png
new file mode 100644
index 0000000..c4c2143
Binary files /dev/null and b/preview screen.png differ
diff --git a/src/App.js b/src/App.js
index 831a50d..fd1e072 100644
--- a/src/App.js
+++ b/src/App.js
@@ -27,6 +27,9 @@ function App() {
   const [message, setMessage] = useState("")
   const [isWaiting, setIsWaiting] = useState(false)
 
+  const [isMintEnabled, setIsMintEnabled] = useState(false)
+
+
   const loadBlockchainData = async () => {
     const provider = new ethers.providers.Web3Provider(window.ethereum)
     setProvider(provider)
@@ -123,6 +126,15 @@ function App() {
     loadBlockchainData()
   }, [])
 
+  useEffect(() => {
+    if (nft !== null) {
+      setIsMintEnabled(true);
+    } else {
+      setIsMintEnabled(false);
+    }
+  }, [nft])
+
+
   return (
     <div>
       <Navigation account={account} setAccount={setAccount} />
@@ -131,7 +143,8 @@ function App() {
         <form onSubmit={submitHandler}>
           <input type="text" placeholder="Create a name..." onChange={(e) => { setName(e.target.value) }} />
           <input type="text" placeholder="Create a description..." onChange={(e) => setDescription(e.target.value)} />
-          <input type="submit" value="Create & Mint" />
+          <input type="submit" value="Create & Mint" disabled={!isMintEnabled} />
+
         </form>
 
         <div className="image">