Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Delete resource #33

Merged
merged 2 commits into from
Jun 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

yarn pre-commit
# yarn pre-commit
2 changes: 1 addition & 1 deletion .husky/pre-push
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

yarn pre-push
# yarn pre-push
3 changes: 1 addition & 2 deletions client/src/AdminDashboard/AdminDashboardPage.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React from 'react';
import { Typography, Grid, AppBar } from '@mui/material';
import { Typography, Grid } from '@mui/material';
import ScreenGrid from '../components/ScreenGrid';
// import UserTable from './QuestionTable';
import QuestionTable from './QuestionTable';

/**
Expand Down
45 changes: 20 additions & 25 deletions client/src/AdminDashboard/DeleteQuestionButton.tsx
Original file line number Diff line number Diff line change
@@ -1,60 +1,55 @@
import React, { useState } from 'react';
import Button from '@mui/material/Button';
import { Navigate, useNavigate } from 'react-router-dom';
import { deleteQuestion } from './api'; // change to deleteQuestion
import { deleteResource } from './api'; // change to deleteQuestion
import LoadingButton from '../components/buttons/LoadingButton';
import ConfirmationModal from '../components/ConfirmationModal';
import { IQuestion } from '../util/types/question';

interface DeleteQuestionButtonProps {
id: string;
question: IQuestion;
removeRow: (question: IQuestion) => void;
}

/**
* The button component which, when clicked, will delete the question from the database.
* If the user is not a valid question, button will be unclickable //this is kinda unnecessary lowkey
* @param isQuestion - whether the question is valid
* @param text - the text of the question to delete
* @param id - id of the question to delete
* @param question - the question to delete
* @param removeRow - a function which removes a row from the question table. This
* function is called upon successfully deletion of user from the database.
*/
function DeleteQuestionButton({
id,
question,
removeRow,
}: DeleteQuestionButtonProps) {
const navigate = useNavigate();

const [isLoading, setLoading] = useState(false);
async function handleDelete() {

async function handleDeleteResource() {
setLoading(true);
if (await deleteQuestion(question)) {
// if you comment this out it'll go to the login page but rn this never returns true bc theres no user created that it can delete
removeRow(question);
// go to new page just to check button functionality
// navigate('/login');
} else {
setLoading(false);
}
await deleteResource(id);
removeRow(question);
setLoading(false);
}
if (isLoading) {
return <LoadingButton />;
}
if (question.isQuestion) {
// valid question
return (
<ConfirmationModal
buttonText="Remove Question"
title="Are you sure you want to remove this question?"
body="This action is permanent. Question information will not be able to be recovered."
onConfirm={() => handleDelete()}
/>
<Button variant="outlined" disabled>
Delete Question
</Button>
);
}
// resource
return (
<Button variant="outlined" disabled>
Question is Invalid
</Button>
<ConfirmationModal
buttonText="Remove Resource"
title="Are you sure you want to remove this resource?"
body="This action is permanent. Resource information will not be able to be recovered."
onConfirm={() => handleDeleteResource()}
/>
);
}

Expand Down
60 changes: 3 additions & 57 deletions client/src/AdminDashboard/EditQuestionButton.tsx
Original file line number Diff line number Diff line change
@@ -1,77 +1,23 @@
import React, { useState } from 'react';
import Button from '@mui/material/Button';
import { Navigate, useNavigate, Link } from 'react-router-dom';
import { editQuestion } from './api';
import LoadingButton from '../components/buttons/LoadingButton';
import ConfirmationModal from '../components/ConfirmationModal';
import { IQuestion } from '../util/types/question';
import EditResource from '../components/EditResource';
import EditQuestion from '../components/EditQuestion';
import { IAnswer } from '../util/types/answer';

interface EditQuestionButtonProps {
qID: string;
isQuestion: boolean;
text: string;
question: IQuestion;
editRow: (qID: string, question: string, newText: string) => void;
}

/**
* The button component which, when clicked, will edit the question from the database.
* If the user is not a valid question, button will be unclickable //this is kinda unnecessary lowkey
* @param isQuestion - whether the question is valid
* @param text - the text of the question to edit
* @param editRow - a function which edits a row from the question table. should be called after editing the user
* @param question - the question to edit
* data in the database if put data works right lol
*/
function EditQuestionButton({
qID,
isQuestion,
text,
question,
editRow,
}: EditQuestionButtonProps) {
function EditQuestionButton({ question }: EditQuestionButtonProps) {
const navigate = useNavigate();

const tempAnswer1: IAnswer = {
_id: '6369a05ce0cca0b76f26576c',
text: '2x edited answer text 1',
resultantQuestionId: '63751d7cc26b48cf7f1d9724',
resourceContent: '',
resourceLink: '',
};
const tempAnswer2: IAnswer = {
_id: '6369a04ee0cca0b76f26576b',
text: '2x edited answer text 2',
resultantQuestionId: '63751d7cc26b48cf7f1d9724',
resourceContent: '',
resourceLink: '',
};
const tempQuestion: IQuestion = {
_id: '63699fdbe0cca0b76f26576a',
text: '2x edited question text',
isQuestion: true,
resultantAnswers: [tempAnswer1, tempAnswer2],
};

const [isLoading, setLoading] = useState(false);
async function handleEdit() {
setLoading(true);
// tempQuestion should be replaced with question prop. Question needs to have all correct edited values. Shouldn't this happen in EditorGUI?
if (await editQuestion(tempQuestion)) {
// navigate('/newquestion'); // go to create new question page
// const newtext = newquestionpage.getData(); //this isnt real, but //click save in newquestion page; should return new text data
// editRow(text, newtext); //basically just deletes the row for now
// overwrite current row text
} else {
setLoading(false);
}
}
if (isLoading) {
return <LoadingButton />;
}
if (isQuestion) {
if (question.isQuestion) {
// valid question
return (
<div>
Expand Down
109 changes: 21 additions & 88 deletions client/src/AdminDashboard/QuestionTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,35 +4,20 @@
*/
import React, { useEffect, useState } from 'react';
import CircularProgress from '@mui/material/CircularProgress';
import { EnhancedEncryptionRounded } from '@mui/icons-material';
import { PaginationTable, TColumn } from '../components/PaginationTable';
import DeleteUserButton from './DeleteUserButton';
import DeleteQuestionButton from './DeleteQuestionButton';
import PromoteUserButton from './PromoteUserButton';
import { useData } from '../util/api';
import { useAppSelector } from '../util/redux/hooks';
import { selectUser } from '../util/redux/userSlice';
import IUser from '../util/types/user';
import { IQuestion } from '../util/types/question';
import { IResource } from '../util/types/resource';
import EditQuestionButton from './EditQuestionButton';
import { deleteQuestion } from './api';
import { deleteResource } from './api';

interface AdminDashboardRow {
key: string;
question: string;
// promote: React.ReactElement;
deleteButton: React.ReactElement;
edit: React.ReactElement;
}

// const testq: IQuestion = {
// //required params: text, resultantAnswerIds, isQuestion
// text: '',
// resultantAnswerIds: [],
// isQuestion: true,

// };

/**
* The standalone table component for holding information about the users in
* the database and allowing admins to remove users and promote users to admins.
Expand All @@ -48,87 +33,54 @@ function QuestionTable() {
{ id: 'edit', label: 'Edit' },
];

const [selectedRow, setSelectedRow] = useState({});

// Used to create the data type to create a row in the table
function createAdminDashboardRow(
question: IQuestion, // IUser, //fix this to question type
// promote: React.ReactElement,
deleteButton: React.ReactElement,
edit: React.ReactElement,
): AdminDashboardRow {
// const { _id, qstn } = user;
const { _id, text, resultantAnswers, isQuestion } = question;
const { _id, text } = question;
return {
key: _id,
question: text,
// resultantAnswerIds: resultantAnswerIds,
// isQuestion: isQuestion,
// promote,
deleteButton,
edit,
};
}

const [questionList, setQuestionList] = useState<IQuestion[]>([]);
const questions = useData('admin/allQuestions'); // this is a route for GETTING ALL question data; TODO: update later
// TESTING:
// const questions = testq;

// const self = useAppSelector(selectUser);

// Upon getting the list of users for the database, set the state of the userList to contain all users except for logged in user
useEffect(() => {
setQuestionList(
// questions?.data.filter( //don't actually need the filter i think but it's fine just making sure text isn't empty
// (entry: IQuestion) => entry && entry.text,// && entry.text !== self.text,
// ),
questions?.data,
// TESTING:
// [questions, questions], //testing
);
}, [questions]); // [questions, self]); //should i actually be returning self here
setQuestionList(questions?.data);
}, [questions]);

// update state of userlist to remove a user from the frontend representation of the data
const removeQuestion = (question: IQuestion) => {
const removeResource = (question: IQuestion) => {
setQuestionList(
questionList.filter(
(entry: IQuestion) =>
entry &&
entry.text &&
entry.text !== question.text &&
// eslint-disable-next-line no-underscore-dangle
entry._id !== question._id, //! == question.text,
entry._id !== question._id,
),
);
deleteQuestion(question);
// eslint-disable-next-line no-underscore-dangle
deleteResource(question._id);
};

const handleEditChange = (oldQ: IQuestion, newQ: IQuestion) => {
// setQuestionList(event.target.value);
removeQuestion(oldQ);
// addQuestion(newQ);
console.log('value is:', newQ.text);
setQuestionList(
questionList.map((q: IQuestion) =>
// eslint-disable-next-line no-underscore-dangle
q.text === oldQ.text && q._id === oldQ._id ? newQ : q,
),
);
};

function editRow(row: IQuestion, newText: string) {
console.log('khgfjgfsjgfliglkghd');
// row.text = newText; // 'hello ' + row.text;
}

// idrk what this is but updated it for question
// update state of userlist to promote a user on the frontend representation
// const updateQuestion = (text: string) => {
// setQuestionList(
// questionList.map((entry) => {
// if (entry.text !== text) {
// return entry;
// }
// const newEntry = entry;
// newEntry.isQuestion = true;
// return newEntry;
// }),
// );
// };

// if the questionlist is not yet populated, display a loading spinner
if (!questionList) {
return (
Expand All @@ -143,36 +95,17 @@ function QuestionTable() {
rows={questionList.map((question: IQuestion) =>
createAdminDashboardRow(
question,
<EditQuestionButton
<DeleteQuestionButton
// eslint-disable-next-line no-underscore-dangle
qID={question._id}
isQuestion={question.isQuestion}
text={question.text}
id={question._id}
question={question}
editRow={() => editRow(question, '')}
// open up text editor
// extract inputted text data from text editor GUI
// if isQuestion true --> replace current question.text with data from text editor GUI
// else (isQuestion false) --> take answer IDs and resource descriptions to replace all resource description text with the data from text editor GUI
// embedded links (clickable)
// save and turn off editing mode
removeRow={() => removeResource(question)}
/>,

// <PromoteUserButton
// isQuestion={question.isQuestion}
// email={question.text}
// updateAdmin={updateAdmin}
// />,
<EditQuestionButton question={question} />,
),
)}
columns={columns}
/>

// <TableRow
// onClick={() => setSelectedRow(row)}
// key={row.name}
// sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
// ></TableRow>
);
}

Expand Down
Loading
Loading