info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-08-29 20:21:50 +02:00
Code Issues Releases Wiki Activity

Integrate question backend

Browse Source
This commit is contained in:
Kamran Ahmed
2023-09-03 19:57:51 +01:00
parent 1ed54bad90
commit 61c3c88fb6
3 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/Questions/QuestionFinished.tsx
View File

@@ -23,7 +23,7 @@ function ProgressStatButton(props: ProgressStatButtonProps) {
<button <button
disabled={isDisabled} disabled={isDisabled}
onClick={onClick} onClick={onClick}
className="group relative flex flex-1 items-center overflow-hidden rounded-xl border border-gray-300 bg-white py-3 px-4 text-black disabled:pointer-events-none disabled:opacity-50" className="group relative flex flex-1 items-center overflow-hidden rounded-xl border border-gray-300 bg-white py-3 px-4 text-black disabled:pointer-events-none disabled:opacity-50 hover:border-black transition-colors"
> >
{icon} {icon}
<span className="flex flex-grow justify-between"> <span className="flex flex-grow justify-between">
@@ -32,7 +32,7 @@ function ProgressStatButton(props: ProgressStatButtonProps) {
</span> </span>
<span className="absolute top-full left-0 right-0 flex h-full items-center justify-center border border-black bg-black text-white transition-all duration-200 group-hover:top-0"> <span className="absolute top-full left-0 right-0 flex h-full items-center justify-center border border-black bg-black text-white transition-all duration-200 group-hover:top-0">
Restart Restart Asking
</span> </span>
</button> </button>
); );
@@ -43,7 +43,7 @@ type QuestionFinishedProps = {
didNotKnowCount: number; didNotKnowCount: number;
skippedCount: number; skippedCount: number;
totalCount: number; totalCount: number;
onReset: (type: QuestionProgressType | 'all') => void; onReset: (type: QuestionProgressType | 'reset') => void;
}; };
export function QuestionFinished(props: QuestionFinishedProps) { export function QuestionFinished(props: QuestionFinishedProps) {
@@ -85,7 +85,7 @@ export function QuestionFinished(props: QuestionFinishedProps) {
</div> </div>
<div className="mt-2 text-sm"> <div className="mt-2 text-sm">
<button <button
onClick={() => onReset('all')} onClick={() => onReset('reset')}
className="flex items-center gap-0.5 text-red-700 hover:text-black" className="flex items-center gap-0.5 text-red-700 hover:text-black"
> >
<RefreshCcw className="mr-1 h-4" /> <RefreshCcw className="mr-1 h-4" />

14
src/components/Questions/QuestionsList.tsx
View File

@@ -80,7 +80,7 @@ export function QuestionsList(props: QuestionsListProps) {
setIsLoading(false); setIsLoading(false);
} }
async function resetProgress(type: QuestionProgressType | 'all' = 'all') { async function resetProgress(type: QuestionProgressType | 'reset' = 'reset') {
let knownQuestions = userProgress?.know || []; let knownQuestions = userProgress?.know || [];
let didNotKnowQuestions = userProgress?.dontKnow || []; let didNotKnowQuestions = userProgress?.dontKnow || [];
let skipQuestions = userProgress?.skip || []; let skipQuestions = userProgress?.skip || [];
@@ -92,7 +92,7 @@ export function QuestionsList(props: QuestionsListProps) {
didNotKnowQuestions = []; didNotKnowQuestions = [];
} else if (type === 'skip') { } else if (type === 'skip') {
skipQuestions = []; skipQuestions = [];
} else if (type === 'all') { } else if (type === 'reset') {
knownQuestions = []; knownQuestions = [];
didNotKnowQuestions = []; didNotKnowQuestions = [];
skipQuestions = []; skipQuestions = [];
@@ -105,7 +105,7 @@ export function QuestionsList(props: QuestionsListProps) {
import.meta.env.PUBLIC_API_URL import.meta.env.PUBLIC_API_URL
}/v1-reset-question-progress/${groupId}`, }/v1-reset-question-progress/${groupId}`,
{ {
type, status: type,
} }
); );
@@ -207,7 +207,7 @@ export function QuestionsList(props: QuestionsListProps) {
isLoading={isLoading} isLoading={isLoading}
showLoginAlert={!isLoggedIn() && hasProgress} showLoginAlert={!isLoggedIn() && hasProgress}
onResetClick={() => { onResetClick={() => {
resetProgress('all').finally(() => null); resetProgress('reset').finally(() => null);
}} }}
/> />
@@ -231,7 +231,7 @@ export function QuestionsList(props: QuestionsListProps) {
knowCount={knowCount} knowCount={knowCount}
didNotKnowCount={dontKnowCount} didNotKnowCount={dontKnowCount}
skippedCount={skipCount} skippedCount={skipCount}
onReset={(type: QuestionProgressType | 'all') => { onReset={(type: QuestionProgressType | 'reset') => {
resetProgress(type).finally(() => null); resetProgress(type).finally(() => null);
}} }}
/> />
@@ -241,8 +241,8 @@ export function QuestionsList(props: QuestionsListProps) {
</div> </div>
<div <div
className={`flex flex-col gap-3 sm:flex-row ${ className={`flex flex-col gap-3 transition-opacity duration-300 sm:flex-row ${
hasFinished ? 'invisible' : 'visible' hasFinished ? 'opacity-0' : 'opacity-100'
}`} }`}
> >
<button <button

2
src/components/Questions/QuestionsProgress.tsx
View File

@@ -30,7 +30,7 @@ export function QuestionsProgress(props: QuestionsProgressProps) {
<div className="mb-3 flex items-center text-gray-600"> <div className="mb-3 flex items-center text-gray-600">
<div className="relative w-full flex-1 rounded-xl bg-gray-200 p-1"> <div className="relative w-full flex-1 rounded-xl bg-gray-200 p-1">
<div <div
className="absolute bottom-0 left-0 top-0 rounded-xl bg-slate-800" className="absolute bottom-0 left-0 top-0 rounded-xl bg-slate-800 transition-[width] duration-400"
style={{ style={{
width: `${donePercentage}%`, width: `${donePercentage}%`,
}} }}