edit: connect to new Cosmic SDK

.env.example

@@ -0,0 +1,7 @@
+# .env
+NEXT_PUBLIC_COSMIC_BUCKET_SLUG=
+NEXT_PUBLIC_COSMIC_READ_KEY=
+COSMIC_WRITE_KEY=
+
+NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=
+STRIPE_SECRET_KEY=

README.md

@@ -19,11 +19,12 @@ This template uses the following technologies:
 - [Read how it was built](https://www.cosmicjs.com/articles/build-a-digital-art-marketplace-with-nextjs-cosmic-and-stripe)
 
 ## Getting started
-1. First, install the [app template](https://www.cosmicjs.com/apps/unft-marketplace) into your Cosmic account to get the demo content ready.
+
+1. First, install the [template](https://www.cosmicjs.com/marketplace/templates/unft-marketplace) into your Cosmic account to get the demo content ready.
 2. Then download and install the code on your machine.
 
 ```bash
-git clone https://github.com/cosmicjs/unft-marketplace.git
+git clone https://github.com/cosmicjs/unft-marketplace
 cd unft-marketplace
 pnpm install
 # or
@@ -33,7 +34,12 @@ npm install
 ```
 
 ### Environment variables
-You'll need to create a `.env` file in the root of the project and add the access keys for Cosmic and Stripe.
+
+You'll need to create a `.env` file in the root of the project and add the access keys for Cosmic and Stripe. This can be done by copying the `.env.example`.
+
+```bash
+cp .env.example .env
+```
 
 **Cosmic**: Go to [Cosmic](https://app.cosmicjs.com/) and from the Bucket that you installed the app template go to _Bucket Settings > API Access_ and get your API access keys.
 
@@ -42,7 +48,7 @@ You'll need to create a `.env` file in the root of the project and add the acces
 Add your keys to the `.env` file like so:
 
 ```bash
-//.env
+# .env
 NEXT_PUBLIC_COSMIC_BUCKET_SLUG=your_cosmic_slug
 NEXT_PUBLIC_COSMIC_READ_KEY=your_cosmic_read_key
 COSMIC_WRITE_KEY=your_cosmic_write_key

package.json

@@ -9,10 +9,10 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@cosmicjs/sdk": "^1.0.9",
     "@stripe/stripe-js": "^1.31.0",
     "classnames": "^2.3.1",
-    "cosmicjs": "^4.2.9",
-    "formidable": "^2.0.1",
+    "formidable": "^3.5.0",
     "fs": "^0.0.1-security",
     "next": "12.1.6",
     "next-connect": "^0.12.2",

src/components/Footer/index.js

@@ -61,7 +61,7 @@ const Footers = ({ navigation }) => {
         <div className={styles.copyright} aria-hidden="true">
           <span className={styles.cosmicGroup}>
             <p className={styles.powered}>Powered by </p>
-            <a href="https://cosmicjs.com/">
+            <a href="https://www.cosmicjs.com">
               <Image
                 className={styles.cosmic}
                 size={{ width: '110px', height: '90px' }}

src/components/OAuth/index.js

@@ -40,7 +40,6 @@ const OAuth = ({ className, handleClose, handleOAuth, disable }) => {
       e.preventDefault()
       fillFiledMessage?.length && setFillFiledMessage('')
       setLoading(true)
-
       if ((email, password)) {
         const auth = await fetch('/api/auth', {
           method: 'POST',
@@ -50,9 +49,7 @@ const OAuth = ({ className, handleClose, handleOAuth, disable }) => {
           },
           body: JSON.stringify({ email, password }),
         })
-
         const cosmicUser = await auth.json()
-
         if (cosmicUser?.hasOwnProperty('user')) {
           setCosmicUser(cosmicUser['user'])
           setToken({
@@ -69,7 +66,7 @@ const OAuth = ({ className, handleClose, handleOAuth, disable }) => {
           setFillFiledMessage('Please first register in Cosmic')
         }
       } else {
-        setFillFiledMessage('Please first all filed')
+        setFillFiledMessage('Please fill all fields')
       }
       setLoading(false)
     },

src/components/SocialMedia/index.js

@@ -10,25 +10,25 @@ import AppLink from '../AppLink'
 import styles from './SocialMedia.module.sass'
 
 const socialMedia = [
-  {
-    Icon: FiFacebook,
-    url: 'https://www.facebook.com/cosmicjs',
-  },
   {
     Icon: FiTwitter,
     url: 'https://twitter.com/cosmicjs',
   },
+  {
+    Icon: FiFacebook,
+    url: 'https://www.facebook.com/cosmicjs',
+  },
   {
     Icon: FiLinkedin,
     url: 'https://www.linkedin.com/company/cosmicjs/',
   },
   {
     Icon: FiYoutube,
-    url: 'https://www.youtube.com/channel/UCDzCWWJLVWLpoHB5oGH0H-A',
+    url: 'https://www.youtube.com/cosmicjs',
   },
   {
     Icon: FiSlack,
-    url: 'https://cosmicslack.herokuapp.com/',
+    url: 'https://cosmcijs.slack.com',
   },
 ]