From 593ab2d7d4ef972594131b125d9320c618e54691 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A1n=20Oliva?= <adrian.oliva@cimat.mx>
Date: Wed, 17 May 2023 21:26:50 -0600
Subject: Redux used to add ToDos
WE MADE IT!! I don't know how, but it is functional. :'3
---
src/ToDo-UI/NewToDo.jsx | 126 -----------------------------------------------
src/ToDo-UI/ToDoList.jsx | 69 --------------------------
2 files changed, 195 deletions(-)
delete mode 100644 src/ToDo-UI/NewToDo.jsx
delete mode 100644 src/ToDo-UI/ToDoList.jsx
(limited to 'src/ToDo-UI')
diff --git a/src/ToDo-UI/NewToDo.jsx b/src/ToDo-UI/NewToDo.jsx
deleted file mode 100644
index e5c1652..0000000
--- a/src/ToDo-UI/NewToDo.jsx
+++ /dev/null
@@ -1,126 +0,0 @@
-import React from "react";
-
-export function NewToDo() {
- return (
- <>
- <div className="container mt-3 mb-3">
- <button
- type="button"
- className="btn btn-outline-dark"
- data-bs-toggle="modal"
- data-bs-target="#NewToDo"
- >
- + New To Do
- </button>
- </div>
-
- <div
- className="modal fade"
- id="NewToDo"
- tabIndex="-1"
- role="dialog"
- aria-labelledby="New To Do Window"
- aria-hidden="true"
- >
- <div
- className="modal-dialog modal-dialog-centered"
- role="document"
- >
- <div className="modal-content">
- <div className="modal-header">
- <h5
- className="modal-title"
- id="exampleModalLongTitle"
- >
- Add a new to do
- </h5>
- <button
- type="button"
- className="close"
- data-bs-dismiss="modal"
- aria-label="Close"
- >
- <span aria-hidden="true">×</span>
- </button>
- </div>
- <div className="modal-body">
- <form>
- <div className="form-floating mb-3">
- <input
- className="form-control"
- id="new-todo-id"
- value="4"
- disabled
- />
- <label htmlFor="floatingInput">ID</label>
- </div>
- <div className="form-floating mb-3">
- <input
- className="form-control"
- placeholder="Text"
- id="new-todo-text"
- />
- <label htmlFor="floatingInput">Text</label>
- </div>
- <div className="input-group mb-3">
- <span className="input-group-text">
- <i className="fa-regular fa-calendar"></i>
- </span>
- <div className="form-floating">
- <input
- className="form-control"
- id="new-todo-due-date"
- name="new-todo-due-date"
- placeholder="Due date"
- />
- <label htmlFor="floatingInput">
- Due Date
- </label>
- </div>
- </div>
- <div class="form-check mb-3">
- <input
- class="form-check-input"
- type="checkbox"
- value=""
- id="flexCheckDefault"
- />
- <label
- class="form-check-label"
- for="flexCheckDefault"
- >
- Done
- </label>
- </div>
- <div class="form-floating mb-3">
- <select
- class="form-select"
- id="floatingSelect"
- aria-label="Floating label select example"
- >
- <option selected>Low</option>
- <option value="1">Medium</option>
- <option value="2">High</option>
- </select>
- <label for="floatingSelect">Priority</label>
- </div>
- </form>
- </div>
- <div className="modal-footer">
- <button
- type="button"
- className="btn btn-secondary"
- data-bs-dismiss="modal"
- >
- Cancel
- </button>
- <button type="button" className="btn btn-primary">
- Add
- </button>
- </div>
- </div>
- </div>
- </div>
- </>
- );
-}
diff --git a/src/ToDo-UI/ToDoList.jsx b/src/ToDo-UI/ToDoList.jsx
deleted file mode 100644
index c6b2d92..0000000
--- a/src/ToDo-UI/ToDoList.jsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React from "react";
-
-export function ToDoList() {
- const todos = [
- {
- id: 1,
- text: "Finish homework.",
- due_date: "2023/05/29",
- done: false,
- priority: "high",
- creation_date: "2023/05/11",
- },
- ];
-
- return (
- <div className="container">
- <table className="table align-middle">
- <thead>
- <tr>
- <th scope="col">#</th>
- <th scope="col">Name</th>
- <th scope="col">Priority</th>
- <th scope="col">Due Date</th>
- <th scope="col">Actions</th>
- </tr>
- </thead>
- <tbody className="table-group-divider">
- {todos.map((item) => (
- <tr>
- <th scope="row">
- <div className="form-check">
- <input
- className="form-check-input"
- type="checkbox"
- value={item.done ? "checked" : ""}
- id="flexCheckChecked"
- ></input>
- </div>
- </th>
- <td>{item.text}</td>
- <td>{item.priority}</td>
- <td>{item.due_date}</td>
- <td>
- <div
- className="btn-group btn-group-sm"
- role="group"
- aria-label="Basic example"
- >
- <button
- type="button"
- className="btn btn-outline-dark"
- >
- Edit
- </button>
- <button
- type="button"
- className="btn btn-outline-dark"
- >
- Delete
- </button>
- </div>
- </td>
- </tr>
- ))}
- </tbody>
- </table>
- </div>
- );
-}
--
cgit v1.2.3