Skip to content

Commit 1a75021

Browse files
npetrolisnpetrolis
committed
More file purging and various fixes
1 parent 8f69ef5 commit 1a75021

File tree

7 files changed

+104
-127
lines changed

7 files changed

+104
-127
lines changed

‎src/components/modal.js renamed to ‎src/components/Utilities/Buttons/DelleteMessage.js

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,32 @@
11
import React from 'react'
22
import 'animate.css'
3+
import axios from 'axios';
4+
import { useNavigate } from "react-router-dom";
35

4-
const Modal = (props) => {
5-
if(!props.openModal) return null
6+
7+
export default function DelleteMessage (props){
8+
let navigate = useNavigate();
9+
const routeChange = () =>{
10+
let path = `/courses`;
11+
navigate(path);
12+
}
13+
function deleteUser(id){
14+
let link = 'https://chain-legendary-strawflower.glitch.me/courses/'+id;
15+
16+
axios.delete(link)
17+
.then(response => {
18+
console.log( 'Delete successful')
19+
routeChange();
20+
21+
}
22+
)
23+
.catch(error => {
24+
console.error('There was an error!', error);
25+
});
26+
27+
}
28+
29+
if(!props.open) return null
630
return (
731
<div className="relative z-10 " aria-labelledby="modal-title" role="dialog" aria-modal="true">
832
<div className="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
@@ -25,7 +49,7 @@ const Modal = (props) => {
2549
</div>
2650
</div>
2751
<div className="bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
28-
<button type="button" className="inline-flex w-full justify-center rounded-md border border-transparent bg-red-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 sm:ml-3 sm:w-auto sm:text-sm">Διαγραφή</button>
52+
<button onClick = {() => deleteUser(props.idNumber)} type="button" className="inline-flex w-full justify-center rounded-md border border-transparent bg-red-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 sm:ml-3 sm:w-auto sm:text-sm">Διαγραφή</button>
2953
<button onClick={props.closeModal} type="button" className="mt-3 inline-flex w-full justify-center rounded-md border border-gray-300 bg-white px-4 py-2 text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">Ακύρωση</button>
3054
</div>
3155
</div>
@@ -34,5 +58,3 @@ const Modal = (props) => {
3458
</div>
3559
)
3660
}
37-
38-
export default Modal

‎src/components/Utilities/Buttons/buttondelete.js

Lines changed: 18 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,25 @@
1-
2-
import axios from 'axios';
3-
import { useNavigate } from "react-router-dom";
1+
import DelleteMessage from './DelleteMessage';
2+
import { useState } from "react";
43

54
export default function ButtonDelete(props){
6-
let navigate = useNavigate();
7-
const routeChange = () =>{
8-
let path = `/courses`;
9-
navigate(path);
10-
}
11-
function deleteUser(id){
12-
var answer = window.confirm("Delete data?");
13-
if (answer) {
14-
let link = 'https://chain-legendary-strawflower.glitch.me/courses/'+id;
15-
//console.log("Try delete",answer, link);
16-
//console.log(typeof link);
17-
axios.delete(link)
18-
.then(response => {
19-
console.log( 'Delete successful')
20-
routeChange();
21-
22-
}
23-
)
24-
.catch(error => {
25-
console.error('There was an error!', error);
26-
});
27-
28-
}
29-
else {
30-
console.log("User did not deleted");
31-
}
5+
6+
const [isModalOpen, setIsModalOpen] = useState(false);
7+
8+
function closeModal() {
9+
setIsModalOpen(false);
3210
}
33-
11+
function openModal() {
12+
setIsModalOpen(true);
13+
}
14+
3415
return (
35-
<button onClick = {() => deleteUser(props.idNumber)} className="border-4 border-indigo-200 hover:border-b-gray-500 bg-blue-500 hover:bg-cyan-600">
16+
<>
17+
<button onClick={() => openModal()} className="border-4 border-indigo-200 hover:border-b-gray-500 bg-blue-500 hover:bg-cyan-600">
3618
<span className="m-8">Delete</span>
3719
</button>
20+
21+
<DelleteMessage idNumber={props.idNumber} closeModal={closeModal} open={isModalOpen} close={closeModal} />
22+
23+
</>
3824
);
39-
}
25+
}

‎src/components/Utilities/Buttons/buttonedit.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useState } from "react";
2-
import EditPage from '../../editPage'
2+
import EditPage from "../../editPage";
33

44
export default function ButtonEdit(props){
55
const [isModalOpen, setIsModalOpen] = useState(false);
@@ -16,7 +16,7 @@ export default function ButtonEdit(props){
1616
<button onClick={() => openModal()} className="border-4 border-indigo-200 hover:border-b-gray-500 bg-blue-500 hover:bg-cyan-600">
1717
<span className="m-8">Edit</span></button>
1818

19-
<EditPage fetchDetails={props.fetchDetails} data = {props.data} idNumber={props.idNumber} open={isModalOpen} close={closeModal} />
19+
<EditPage fetchDetails={props.fetchDetails} data = {props.data} idNumber={props.idNumber} open={isModalOpen} close={closeModal} />
2020
</div>
2121
);
2222
}

‎src/components/Utilities/Buttons/buttons.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,17 @@
22
import ButEdit from "./buttonedit";
33
import ButDel from "./buttondelete";
44

5+
6+
57
export default function Buttons(props){
8+
69
return (
710
<div className="grid grid-cols-5 gap-4 text-lg m-8">
811
<div className="col-span-3"></div>
9-
<div><ButEdit fetchDetails={props.fetchDetails} data={props.data} idNumber={props.idNumber}/></div>
12+
<div><ButEdit data={props.data} idNumber={props.idNumber}/></div>
1013
<div><ButDel idNumber={props.idNumber} /></div>
14+
<>
15+
</>
1116

1217
</div>
1318
);

‎src/components/editPage.js

Lines changed: 51 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,19 @@
11
import React, { useState } from 'react';
2+
import {Link} from 'react-router-dom';
23
import axios from "axios";
3-
console.clear();
4+
45
export default function EditPage(props) {
5-
// const [post, setPost] = useState(null);
6+
<div className="row">
7+
<Link to='/' className='text-black-50 p-2 col-md-5'>Go Back</Link>
8+
</div>
9+
10+
611
const [title, setTitle] = useState(props.data.title);
712
const [duration, setDuration] = useState(props.data.duration);
813
const [imagePath, setImagePath] = useState(props.data.imagePath);
914
const [online, setOnline] = useState(props.data.online);
1015
const [description, setDescription] = useState(props.data.description);
16+
1117
const [start_date, setStart_date] = useState(props.data.dates.start_date);
1218
const [end_date, setEnd_date] = useState(props.data.dates.end_date);
1319
const [early_bird, setEarly_bird] = useState(props.data.price.early_bird);
@@ -27,115 +33,130 @@ export default function EditPage(props) {
2733
online,
2834
description,
2935
};
30-
console.log('Link https://chain-legendary-strawflower.glitch.me/courses'+props.idNumber);
31-
axios.put('https://chain-legendary-strawflower.glitch.me/courses'+props.idNumber, data)
36+
37+
console.log('Link https://chain-legendary-strawflower.glitch.me/courses/'+props.idNumber);
38+
axios.put('https://chain-legendary-strawflower.glitch.me/courses/'+props.idNumber, data)
3239
.then((response) => {
3340
console.log("THE END",response)
34-
}
41+
42+
43+
}
3544
)
3645
.catch((error) => console.log(error));
46+
3747
props.close();
3848
props.fetchDetails();
49+
3950
}
51+
52+
4053
if (!props.open) return null;
4154
return (
42-
// <div className="z-10 " aria-labelledby="modal-title" role="dialog" aria-modal="true">     
43-
// <div className="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
44-
<div className="overflow-scroll">
4555

46-
<form onSubmit={handleSubmit} className="fixed top-5 left-5 right-10 bg-sky-100">
47-
<button type="button" className="absolute top-0 right-0 h-16 w-16 box-border p-4 border-4 bg-gradient-to-r from-sky-400 to-red-500 hover:from-pink-500 hover:to-blue-500"
56+
<div className="z-10 " aria-labelledby="modal-title" role="dialog" aria-modal="true">
57+
<div className="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
58+
59+
<div style={{ position: 'relative', zIndex: '2'}} className="">
60+
61+
<form onSubmit={handleSubmit} className="fixed top-5 left-10 right-10 sm:max-xl:flex sm:max-xl:flex-wrap sm:max-xl:w-[90%] sm:max-xl:h-[90%] sm:max-xl:overflow-auto bg-sky-100">
62+
<button type="button" className="absolute top-0 right-0 box-border h-12 w-12 p-4 border-4 bg-gradient-to-r from-sky-400 to-red-500 hover:from-pink-500 hover:to-blue-500"
4863
onClick={() => {
4964
props.close();
5065
}}
5166
>
5267
X
5368
</button>
54-
<h1 className="m-2 font-extrabold text-5xl mb-8 ">Edit Course</h1>
69+
<h1 className="m-2 font-extrabold text-5xl ">Edit Course</h1>
5570
<div className="flex flex-wrap -mx-2">
5671
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
5772
<label
58-
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" htmlFor="grid-first-name">
73+
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold" htmlFor="grid-first-name">
5974
Title
6075
</label>
6176
<input required value={title}
62-
className="mx-4 appearance-none block w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500 justify-center"
77+
className=" mx-4 appearance-none block w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500 justify-center"
6378
name="title" type="text"
6479
onChange={
6580
(e) => setTitle((e.target.value))
6681
} placeholder="Lesson"></input>
6782
</div>
6883
<div className="w-full md:w-1/2 px-2">
6984
<label
70-
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" htmlFor="grid-first-name">
85+
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold" htmlFor="grid-first-name">
7186
Duration
7287
</label>
7388
<input required value={duration}
74-
className="mx-4 block w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
89+
className=" mx-4 block w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
7590
name="duration" type="text" onChange={(e) => setDuration((e.target.value))} placeholder="Duration"></input>
7691
</div>
7792
</div>
7893
<label
79-
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" htmlFor="grid-first-name">
94+
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold " htmlFor="grid-first-name">
8095
Image Path
8196
</label>
8297
{<input required value={imagePath}
83-
className="mx-4 w-[95%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
98+
className=" mx-4 w-[95%] bg bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
8499
name="imagePath" type="text" onChange={(e) => setImagePath((e.target.value))} placeholder="Image Path"></input>}
85100
<label
86-
className="m-3 uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
101+
className="m-3 uppercase tracking-wide text-gray-700 text-xs font-bold" >
87102
online
88103
</label>
89104
<input checked={online} type="checkbox" onChange={(e) => setOnline((e.target.checked))} />
90105
<label
91-
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
106+
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold " >
92107
description
93108
</label>
94109
<textarea required value={description}
95-
className="block mx-4 w-[95%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3"
110+
className="block mx-4 w-[95%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 "
96111
name="description" type="text" onChange={(e) => setDescription((e.target.value))}>
97112
</textarea>
98113

99-
<p className="m-2 font-bold font-weight: 700">Dates</p>
114+
<p className=" m-2 font-bold font-weight: 700">Dates</p>
100115
<div className="flex flex-wrap -mx-2">
101116
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
102117
<label
103118
className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
104119
Start Date
105120
</label>
106121
<input required value={start_date}
107-
className="mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
122+
className=" mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
108123
name="start_date" type="date" onChange={(e) => setStart_date((e.target.value))}></input>
109124
</div>
110125
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
111-
<label className="m-2 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
126+
<label className="m-2 block uppercase tracking-wide text-gray-700 text-xs font-bold" >
112127
End Date
113128
</label>
114129
<input required value={end_date} className="mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
115130
name="end_date" type="date" onChange={(e) => setEnd_date((e.target.value))}></input>
116131
</div>
117132
</div>
118-
<p className="m-3 font-bold font-weight: 700"> Price </p>
119-
<div className="flex flex-wrap -mx-2">
120-
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
133+
<p className="m-2 font-bold font-weight: 700"> Price </p>
134+
135+
<div className="flex flex-wrap -mx-2 ">
136+
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
137+
138+
121139
<label className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
122140
Early Bird
123141
</label>
124-
<input required value = {early_bird} className="mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
142+
<input required value = {early_bird} className=" mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
125143
name="early_bird" type="number" onChange={(e) => setEarly_bird((e.target.value))}></input>
126144
</div>
127-
<div className="w-full md:w-1/2 px-2 mb-4 md:mb-0">
128-
<label className="m-3 block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" >
145+
<div className= "w-full md:w-1/2 px-2 mb-4 md:mb-0">
146+
<label className="m-2 block uppercase tracking-wide text-gray-700 text-xs font-bold" >
129147
Normal Price
130148
</label>
131149
<input required value={normal} className="mx-4 w-[90%] bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
132150
name="normal" type="number" onChange={(e) => setNormal((e.target.value))}></input>
133151
</div>
152+
134153
</div>
135154
<button className="m-2 float-right bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded text-right " type='submit'> Update Course </button>
136155
</form>
156+
157+
</div>
137158
</div>
138-
// </div>
159+
139160
);
140161

141162
}

‎src/components/searchbar.js

Lines changed: 0 additions & 17 deletions
This file was deleted.

0 commit comments

Comments
 (0)