Merge pull request #32 from DushanSenadheera/dev

add client data input captures

client/src/pages/Budget/Budget.tsx

@@ -1,9 +1,15 @@
+import { useState } from "react";
 import "./budget.scss";
 import { Link } from "react-router-dom";
 import { TextInput } from "@mantine/core";
 import bg2 from "../../assets/bg2.png";
 
 export default function Budget() {
+
+  const [budget, setBudget] = useState(0);
+  const handleData = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setBudget(Number(e.target.value));
+  }
   return (
     <div className="budget">
       <div className="budget-img">
@@ -15,13 +21,8 @@ export default function Budget() {
           <p>Enter your budget</p>
           <br />
           <TextInput
-            label="Minimum Budget"
-            withAsterisk
-            placeholder="USD"
-            type="number"
-          />
-          <br />
-          <TextInput
+            onChange={handleData}
+            value={budget}
             label="Maximum Budget"
             withAsterisk
             placeholder="USD"

client/src/pages/Destination/Destination.tsx

@@ -1,15 +1,22 @@
+import { useState } from "react";
 import "./Destination.scss";
 import { Link } from "react-router-dom";
 import { TextInput } from "@mantine/core";
 import bg from "../../assets/bg.png";
-import UserInputLayout from "../../layouts/userInputLayout/userInputLayout";
+import UserInputLayout from "../../layouts/userInputLayout/UserInputLayout";
 
 export default function Destination() {
+
+  const [destination, setDestination] = useState("");
+  const handleData = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setDestination(e.target.value);
+  }
+
   return (
     <UserInputLayout bg={bg}>
       <form>
         <h1>Destination</h1>
-        <TextInput label="Enter your destination" withAsterisk placeholder="City Name" />
+        <TextInput onChange={handleData} label="Enter your destination" value={destination} withAsterisk placeholder="City Name" />
       </form>
       <Link to="/duration">
         <button className="next secondary-btn">Next</button>

client/src/pages/Duration/Duration.tsx

@@ -1,9 +1,17 @@
+import { useState } from "react";
 import "./Duration.scss";
 import { Link } from "react-router-dom";
 import { NumberInput } from "@mantine/core";
 import bg3 from "../../assets/bg3.png";
 
 export default function Duration() {
+
+  const [Duration, setDuration] = useState(1);
+  const handleData = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setDuration(Number(e.target.value));
+  }
+  console.log(Duration)
+
   return (
     <div className="duration">
       <div className="duration-img">
@@ -15,6 +23,8 @@ export default function Duration() {
           <p>Enter your travel duration</p>
           <br />
             <NumberInput
+              onChange={handleData}
+              value={Duration}
               label="Travel Duration"
               withAsterisk
               placeholder="Days"

client/src/pages/Interests/Interests.tsx

@@ -1,9 +1,17 @@
+import { useState } from "react";
 import "./Interests.scss";
 import { Link } from "react-router-dom";
 import { Chip  } from "@mantine/core";
 import bg4 from "../../assets/bg4.png";
 
 export default function interests() {
+
+  const [selectedInterests, setSelectedInterests] = useState([]);
+
+  const handleChipClick = (interest) => {
+    setSelectedInterests([...selectedInterests, interest]);
+  };
+  console.log(selectedInterests)
   return (
     <div className="interests">
       <div className="interests-img">
@@ -15,13 +23,13 @@ export default function interests() {
           <p>Select your interests</p>
           <br />
           <div className="chips">
-            <Chip color="black">Religous Places</Chip>
-            <Chip color="black">Must See Attractions</Chip>
-            <Chip color="black">Historical</Chip>
-            <Chip color="black">Hidden Gems</Chip>
-            <Chip color="black">Beaches</Chip>
-            <Chip color="black">Tasty Foods</Chip>
-            <Chip color="black">Viewpoints</Chip>
+            <Chip onClick={() => handleChipClick("Religous Places")} color="black">Religous Places</Chip>
+            <Chip onClick={() => handleChipClick("Must See Attractions")} color="black">Must See Attractions</Chip>
+            <Chip onClick={() => handleChipClick("Historical")} color="black">Historical</Chip>
+            <Chip onClick={() => handleChipClick("Hidden Gems")} color="black">Hidden Gems</Chip>
+            <Chip onClick={() => handleChipClick("Beaches")} color="black">Beaches</Chip>
+            <Chip onClick={() => handleChipClick("Tasty Foods")} color="black">Tasty Foods</Chip>
+            <Chip onClick={() => handleChipClick("Viewpoints")} color="black">Viewpoints</Chip>
           </div>
         </form>
         <Link to='/results'><button className="next secondary-btn">Next</button></Link>

model/src/eat.py

@@ -29,7 +29,7 @@ def recommend_locations_based_on_features(index, cosine_sim=cosine_sim):
     return recommended_locations
 
 # Get user input
-user_input_location = "Weligama"
+user_input_location = sys.argv[1]
 
 # Find the index of the location that matches the user's input
 location_index = df.loc[(df['Location'] == user_input_location)].index[0]

model/src/location.py

@@ -86,10 +86,10 @@ def recommend_locations(user_input_location, user_input_categories, user_input_b
     return recommended_locations_per_day
 
 # Get user input
-user_input_location = "Tangalle"
-user_input_category = ["point of interests", "beaches", "nature & wildlife"]
-user_input_budget = 1000
-user_input_days = 3  # Number of days
+user_input_location = sys.argv[1]
+user_input_category = sys.argv[2] # List of categories
+user_input_budget = sys.argv[3]  # Budget in dollars
+user_input_days = sys.argv[4]  # Number of days
 
 # Recommend locations based on the user's input
 recommendations = recommend_locations(user_input_location, user_input_category, user_input_budget, user_input_days)

model/src/stay.py

@@ -29,7 +29,7 @@ def recommend_locations_based_on_features(index, cosine_sim=cosine_sim):
     return recommended_locations
 
 # Get user input
-user_input_location = "Galle"
+user_input_location = sys.argv[1]
 
 # Find the index of the location that matches the user's input
 location_index = df.loc[(df['Location'] == user_input_location)].index[0]

server/routes/foodRoute.js

@@ -4,17 +4,11 @@ const router = express.Router();
 
 router.get('/api/food/', (req, res) => {
 
-    // const {location, catergory, duration, budget} = req.body;
-    // const data = {
-    //     "location": location,
-    //     "catergory": catergory,
-    //     "duration": duration,
-    //     "budget": budget
-    // };
+    const location = "Tangalle"
 
     let dataToSend;
     // spawn new child process to call the python script
-    const python = spawn('python', ['../model/src/eat.py']);
+    const python = spawn('python', ['../model/src/eat.py', location]);
     // collect data from script
     python.stdout.on('data', function (data) {
         console.log('Pipe data from python script ...');

server/routes/locationRoute.js

@@ -4,17 +4,14 @@ const router = express.Router();
 
 router.get('/api/location/', (req, res) => {
 
-    // const {location, catergory, duration, budget} = req.body;
-    // const data = {
-    //     "location": location,
-    //     "catergory": catergory,
-    //     "duration": duration,
-    //     "budget": budget
-    // };
+    const location = "Tangalle"
+    const budget = "1000"
+    const duration = "3"
+    const catergories = "beaches"
 
     let dataToSend;
     // spawn new child process to call the python script
-    const python = spawn('python', ['../model/src/location.py']);
+    const python = spawn('python', ['../model/src/location.py'], [location, catergories, budget, duration]);
     // collect data from script
     python.stdout.on('data', function (data) {
         console.log('Pipe data from python script ...');

server/routes/stayRoute.js

@@ -4,17 +4,11 @@ const router = express.Router();
 
 router.get('/api/stay/', (req, res) => {
 
-    // const {location, catergory, duration, budget} = req.body;
-    // const data = {
-    //     "location": location,
-    //     "catergory": catergory,
-    //     "duration": duration,
-    //     "budget": budget
-    // };
+    const location = "Tangalle"
 
     let dataToSend;
     // spawn new child process to call the python script
-    const python = spawn('python', ['../model/src/stay.py']);
+    const python = spawn('python', ['../model/src/stay.py', location]);
     // collect data from script
     python.stdout.on('data', function (data) {
         console.log('Pipe data from python script ...');