adding the influencer page and adding the funcitons in it

3 files changed, 35 insertions, 15 deletions

diff --git a/client/package-lock.json b/client/package-lock.json
index a6fa0c1..8efb06a 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -12,6 +12,7 @@
         "@testing-library/react": "^13.4.0",
         "@testing-library/user-event": "^13.5.0",
         "axios": "^1.7.2",
+        "dotenv": "^16.4.5",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-router-dom": "^6.24.0",
@@ -7763,12 +7764,15 @@
       }
     },
     "node_modules/dotenv": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
-      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "version": "16.4.5",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz",
+      "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==",
       "license": "BSD-2-Clause",
       "engines": {
-        "node": ">=10"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
       }
     },
     "node_modules/dotenv-expand": {
@@ -16403,6 +16407,15 @@
         }
       }
     },
+    "node_modules/react-scripts/node_modules/dotenv": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
+      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
diff --git a/client/package.json b/client/package.json
index 70e70ca..71228a9 100644
--- a/client/package.json
+++ b/client/package.json
@@ -7,6 +7,7 @@
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
     "axios": "^1.7.2",
+    "dotenv": "^16.4.5",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.24.0",
diff --git a/client/src/Influencers.js b/client/src/Influencers.js
index a72d654..cfa28d9 100644
--- a/client/src/Influencers.js
+++ b/client/src/Influencers.js
@@ -1,16 +1,18 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import axios from 'axios';
+require('dotenv').config();
 
-function Influencers({ adminPassword }) {
+function Influencers() {
   const [profiles, setProfiles] = useState([]);
   const [newProfile, setNewProfile] = useState('');
 
+  const adminPassword = process.env.ADMIN_PASSWROD;
+
   const fetchProfiles = useCallback(async () => {
     try {
-      const response = await axios.get('http://localhost:5001/profiles', {
-        headers: { Authorization: `Bearer ${adminPassword}` }
+      const response = await axios.get('http://localhost:5001/influencers', {
+        headers: { 'x-admin-password': adminPassword }
       });
-      console.log('Fetched profiles:', response.data);
       setProfiles(response.data);
     } catch (error) {
       console.error('Error fetching profiles:', error);
@@ -23,11 +25,13 @@ function Influencers({ adminPassword }) {
 
   const addProfile = async () => {
     try {
+      const updatedProfiles = [...profiles, newProfile];
       await axios.post(
-        'http://localhost:5001/profiles',
-        { username: newProfile },
-        { headers: { Authorization: `Bearer ${adminPassword}` } }
+        'http://localhost:5001/influencers',
+        { profiles: updatedProfiles },
+        { headers: { 'x-admin-password': adminPassword } }
       );
+      setProfiles(updatedProfiles);
       setNewProfile('');
       fetchProfiles();
     } catch (error) {
@@ -42,10 +46,10 @@ function Influencers({ adminPassword }) {
       formData.append('file', file);
 
       try {
-        await axios.post('http://localhost:5001/upload', formData, {
+        await axios.post('http://localhost:5001/import-influencers', formData, {
           headers: {
             'Content-Type': 'multipart/form-data',
-            Authorization: `Bearer ${adminPassword}`
+            'x-admin-password': adminPassword
           }
         });
         fetchProfiles();
@@ -57,8 +61,8 @@ function Influencers({ adminPassword }) {
 
   const exportJson = async () => {
     try {
-      const response = await axios.get('http://localhost:5001/export', {
-        headers: { Authorization: `Bearer ${adminPassword}` },
+      const response = await axios.get('http://localhost:5001/export-influencers', {
+        headers: { 'x-admin-password': adminPassword },
         responseType: 'blob'
       });
       const url = window.URL.createObjectURL(new Blob([response.data]));
@@ -82,12 +86,14 @@ function Influencers({ adminPassword }) {
         placeholder="Enter Instagram username"
       />
       <button onClick={addProfile}>Add</button>
+
       <h3>Current Influencers</h3>
       <ul>
         {profiles.map((profile, index) => (
           <li key={index}>{profile}</li>
         ))}
       </ul>
+
       <h3>Import/Export Influencers</h3>
       <input
         type="file"