Skip to content

Commit

Permalink
Delete unused files. Modularize components in UploadManual
Browse files Browse the repository at this point in the history
  • Loading branch information
@AliceeLe
AliceeLe committed Jul 1, 2024
1 parent 2ffd7de commit 0b9d6d8
Show file tree
Hide file tree
Showing 6 changed files with 84 additions and 222 deletions.
23 changes: 0 additions & 23 deletions src/components/Button.tsx
View file

This file was deleted.

13 changes: 0 additions & 13 deletions src/components/Dropdown.css
View file

This file was deleted.

115 changes: 0 additions & 115 deletions src/components/Dropdown.tsx
View file

This file was deleted.

7 changes: 1 addition & 6 deletions src/components/Search.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,7 @@
import React, { useEffect, useState } from "react";
// search input
import { IoSearch } from "react-icons/io5";
import { RxCross1 } from "react-icons/rx";
import { SearchCard, SavedSearchBtn, SearchBar } from "./index";
import Fuse from 'fuse.js'
import DropInData from "../../backend/scraper/drop_in.json";
// for date picker
import dayjs, { Dayjs } from 'dayjs';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
Expand All @@ -19,11 +16,9 @@ import Select, { SelectChangeEvent } from '@mui/material/Select';
import Checkbox from '@mui/material/Checkbox';
import { categoryListAcademics, categoryListClubs, categoryListCareer } from "../types";
// selectable dropdown
// import { Dropdown } from "./Dropdown";
import { Button } from "./Button";

import "react-dropdown/style.css";
import "./Search.css";

// import useSearch from "../../utils/hooks/useSearch";
import DITData from "../../backend/scraper/drop_in.json";
import PTData from "../../backend/scraper/peer_tutoring.json";
Expand Down
7 changes: 3 additions & 4 deletions src/components/index.ts
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@
export * from "./Dropdown";
export * from "./MyCalendar";
export * from "./Navbar";
export * from "./Search";
export * from "./SearchCard";
export * from "./SecondNav";
export * from "./Footer";
export * from "./Search";
export * from "./SearchBar";
export * from "./SavedSearches";
export * from "./SearchCard";
export * from "./SecondNav";
141 changes: 80 additions & 61 deletions src/pages/UploadManual.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,77 +2,96 @@ import React from 'react';
import { UploadNavBar, UploadButton } from "./index";
import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
import { Footer } from "../components";
import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

interface InputProps {
title: string;
requiredBool: boolean;
}

const Input: React.FC<InputProps> = ({ title, requiredBool }) => {
return (
<div className="mb-4">
<label className="block text-gray-700">
{title}
{requiredBool && <span className="text-red">*</span>}
</label>
<input
type="text"
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
required={requiredBool}
/>
</div>
)
}

const Category: React.FC = () => {
return (
<div className="mb-4">
<label className="block text-gray-700">Event Type<span className="text-red">*</span></label>
<select
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
required
>
<option value="">Select Event Type</option>
<option value="Academics">Academics</option>
<option value="Club">Club</option>
<option value="Career">Career</option>
</select>
</div>
)
}

const Time: React.FC = () => {
return (
<div className="mb-4">
<div className="flex gap-4">
<div className="w-1/2">
<label className="block text-gray-700">From<span className="text-red">*</span></label>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DateTimePicker className="w-full" />
</LocalizationProvider>
</div>
<div className="w-1/2">
<label className="block text-gray-700">To<span className="text-red">*</span></label>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DateTimePicker className="w-full" />
</LocalizationProvider>
</div>
</div>

</div>
)
}

const Note: React.FC = () => {
return (
<div className="mb-4">
<label className="block text-gray-700">Notes</label>
<textarea
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
rows={2}
></textarea>

</div>
)
}
const UploadManual: React.FC = () => {
return (
<div>
<div className="h-lvh">

<div className="flex flex-col justify-center items-center w-4/6 mx-auto relative">
<UploadNavBar />
<div className="bg-[#F1F1F1] w-full h-[620px] px-20 pt-10">
<div className="bg-[#F1F1F1] w-full h-[680px] px-20 pt-8 pb-20">
<form>
<div className="mb-4">
<label className="block text-gray-700">Course Number<span className="text-red">*</span></label>
<input
type="text"
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
required
/>
</div>
<div className="mb-4">
<label className="block text-gray-700">Event Type<span className="text-red">*</span></label>
<select
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
required
>
<option value="">Select Event Type</option>
<option value="Academics">Academics</option>
<option value="Club">Club</option>
<option value="Career">Career</option>
</select>
</div>
<div className="mb-4">
<div className="flex gap-4">
<div className="w-1/2">
<label className="block text-gray-700">From<span className="text-red">*</span></label>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DateTimePicker className="w-full"/>
</LocalizationProvider>
</div>
<div className="w-1/2">
<label className="block text-gray-700">To<span className="text-red">*</span></label>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DateTimePicker className="w-full"/>
</LocalizationProvider>
</div>
</div>
</div>
<div className="mb-4">
<label className="block text-gray-700">Location/Meeting Link<span className="text-red">*</span></label>
<input
type="text"
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
required
/>
</div>
<div className="mb-4">
<label className="block text-gray-700">Instructor/TA</label>
<input
type="text"
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
/>
</div>
<div className="mb-4">
<label className="block text-gray-700">Notes</label>
<textarea
className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
rows={2}
></textarea>
</div>
<Input title="Course Number" requiredBool={true} />
<Category />
<Time />
<Input title="Location/Meeting Link" requiredBool={true} />
<Input title="Instructor/TA" requiredBool={false} />
<Input title="Location/Meeting Link" requiredBool={true} />
<Note />
<div className="absolute bottom-5 right-20"><UploadButton /></div>
</form>
</div>
Expand Down

0 comments on commit 0b9d6d8

Please sign in to comment.