feat: Now using Axios and translated the shape query as the API

Author: atapas

components/core/App.js

@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from "react";
+import axios from "axios";
 import dynamic from "next/dynamic";
 
 // harperDb fetch call
@@ -33,28 +34,22 @@ const App = (props) => {
     let shapes = [];
 
     if(user.length === 0) {
-      // User is not logged In. Fetch all the public shapes
-      shapes = await harperFetch({
-        operation: "sql",
-        sql: `SELECT * 
-          FROM tryshape.shapes s 
-          INNER JOIN tryshape.users u 
-          ON s.createdBy=u.email 
-          WHERE s.private=false
-          ORDER BY s.likes DESC`,
+      // User is not logged In. Fetch all the public shapes 
+      const response = await axios.get("/api/GET/shapes", {
+        params: {
+          type: 'private'
+        }
       });
+      shapes = response.data;
     } else {
       // User is logged in. Let's fetch the private shape and other public shapes.
-      shapes = await harperFetch({
-        operation: "sql",
-        sql: `SELECT *
-          FROM tryshape.shapes s
-          INNER JOIN tryshape.users u 
-          ON s.createdBy=u.email 
-          WHERE s.private=false 
-          OR createdBy = '${user.email}'
-          ORDER BY s.likes DESC`,
+      const response = await axios.get("/api/GET/shapes", {
+        params: {
+          type: 'public-logged-in',
+          email: user.email
+        }
       });
+      shapes = response.data;
 
       // Fetch the shapes liked by the logged-in user
       const likedShapes = await harperFetch({

package.json

@@ -8,6 +8,7 @@
     "start": "next start"
   },
   "dependencies": {
+    "axios": "^0.21.1",
     "bootstrap": "4.6.0",
     "date-fns": "^2.22.1",
     "downloadjs": "^1.4.7",

pages/api/GET/shapes.js

@@ -0,0 +1,42 @@
+export default async function handler(req, res) {
+    const { type, email } = req.query;
+    console.log(req.query);
+    console.log(`Shape type to query is ${type}`);
+
+    let sql;
+    if (type === 'private') {
+        sql = `SELECT * 
+            FROM tryshape.shapes s 
+            INNER JOIN tryshape.users u ON s.createdBy=u.email 
+            WHERE s.private=false 
+            ORDER BY s.likes DESC`;
+    } else if(type === 'public') {
+        sql = `SELECT * FROM tryshape.shapes`;
+    } else if(type === 'public-logged-in') {
+        console.log(`email is ${email}`);
+        sql = `SELECT *
+            FROM tryshape.shapes s
+            INNER JOIN tryshape.users u 
+            ON s.createdBy=u.email 
+            WHERE s.private=false 
+            OR createdBy = '${email}'
+            ORDER BY s.likes DESC`;
+    }
+
+    const request = await fetch(process.env.NEXT_PUBLIC_DB_URL, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Basic ${process.env.NEXT_PUBLIC_DB_AUTHORIZATION}`,
+      },
+      body: JSON.stringify({
+        operation: "sql",
+        sql: sql,
+      }),
+    });
+  
+    const data = await request.json();
+    // console.log(data);
+  
+    res.status(200).json(data);
+  }

yarn.lock

@@ -677,6 +677,13 @@ available-typed-arrays@^1.0.2:
   resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.4.tgz#9e0ae84ecff20caae6a94a1c3bc39b955649b7a9"
   integrity sha512-SA5mXJWrId1TaQjfxUYghbqQ/hYioKmLJvPJyDuYRtXXenFNMjj4hSSt1Cf1xsuXSXrtxrVC5Ot4eU6cOtBDdA==
 
+axios@^0.21.1:
+  version "0.21.1"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.1.tgz#22563481962f4d6bde9a76d516ef0e5d3c09b2b8"
+  integrity sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==
+  dependencies:
+    follow-redirects "^1.10.0"
+
 "babel-plugin-styled-components@>= 1.12.0", babel-plugin-styled-components@^1.12.0:
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.12.0.tgz#1dec1676512177de6b827211e9eda5a30db4f9b9"
@@ -1290,6 +1297,11 @@ firebase@^8.6.7:
     "@firebase/storage" "0.5.4"
     "@firebase/util" "1.1.0"
 
+follow-redirects@^1.10.0:
+  version "1.14.1"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.1.tgz#d9114ded0a1cfdd334e164e6662ad02bfd91ff43"
+  integrity sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==
+
 foreach@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/foreach/-/foreach-2.0.5.tgz#0bee005018aeb260d0a3af3ae658dd0136ec1b99"