-
Notifications
You must be signed in to change notification settings - Fork 6
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
Create Admin Page frontend #67
base: main
Are you sure you want to change the base?
Conversation
create dummy data to display create PDFtable and PDFListElement components create IAdminResult interface
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
left click to approve, click again to mark pending right click to reject, click again to mark pending alt + z toggles edit mode next task is to add keyboard shortcuts for approve/reject and move autofocus in a convenient way, then i will get started on styling, sorting, and filtering
<td><input type="string" value={questionPaperDetails.course_code} onInput={(e) => setQuestionPaperDetails("course_code", e.target.value)} readonly={!props.isEditMode}/></td> | ||
<td><input type="string" value={questionPaperDetails.course_name} onInput={(e) => setQuestionPaperDetails("course_name", e.target.value)} readonly={!props.isEditMode}/></td> | ||
<td><input type="string" value={questionPaperDetails.exam} onInput={(e) => setQuestionPaperDetails("exam", e.target.value)} readonly={!props.isEditMode}/></td> | ||
<td><input type="string" value={questionPaperDetails.semester} onInput={(e) => setQuestionPaperDetails("semester", e.target.value)} readonly={!props.isEditMode}/></td> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You can make these select inputs since they only have a few options.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done, however I haven't been able validate that the course_code and course_name match
one idea I had was to have the course_name display the value from the courses.json file for the corresponding key, this should be doable using the format method in solid-select, however I wasn't able to figure it out. some help with that would be quite nice
frontend/src/components/PDFTable.tsx
Outdated
setIsEditMode(!isEditMode()); | ||
} | ||
|
||
createShortcut( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think we really need an "edit mode" for the entire page. We can have an edit button per paper that opens a modal that will have a form for editing.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
i'll implement this once i make the modal to view the pdf, until then if we're just using the new tab link functionality i feel like being able to see all the question papers together will make the process faster
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
see all the question papers together will make the process faster
Hmm, true. In that case, instead of an edit mode, make an edit button that becomes enabled if something is changed. Clicking on it will update the data on the backend.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
isEditMode is removed
i'm still not very happy with my current approve/reject functionality, what other methods would you suggest, keeping in mind speed of approval?
is a button fine?
do we need further confirmation before approval?
how can i make this process faster and error free?
these are some questions I need to answer before I completely fix this, until then I'll make the table sortable
used solid-select library took me forever to realise that I needed the createOptions thing looking further is adding dropdown for course_names in such a way to validate input with course_codes
need help with validating input between course_codes and course_names adding dropdown input to remaining inputs next
fix: remove isEditable mode, will be replaced soon year dropdown input shows every year since 1951, easy to customise
need to style table more need to fix the trash approve/reject workflow need to figure out how to validate the input/output with solid-select
I think we can skip the modal part. A link to the pdf is more than enough, it'll open in the browser's pdf viewer. |
need to style focused element to be more visible, couldn't figure out solid-select styling removed the coursesSelectMenu component because it was redundant next would be sorting capability ig because I think I have an idea of how to fix that
the modal part would probably be the last step, so yeah, we should have something functional before we get to that. I don't think we need to scrap it completely just yet though, we may be able to do something cool to make the approval process really fast with it |
…details leads to fix: questionpaper year is being updated now
logic looks a little complicated rn, will try to simplify looking into making table elements searchable still need to make good approve/reject mechanism
I thought captions were useful if the table didn't load or for accessibility reasons |
Hmm, it looked weird in that place. Maybe we can add it back in the future when we (probably) add more features to the admin dashboard - stats etc. |
If the dashboard has multiple sections it would make more sense. Right now it is just a way to approve uploaded papers. |
Tasks
Issues
Fixes #63