tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
Archived
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

style: fix linting issues met Prettier

Browse source
This commit is contained in:
Lint Action 2025-04-24 19:28:16 +00:00
parent b45fc47b06
commit 18e17e0133
9 changed files with 184 additions and 160 deletions
Download patch file Download diff file Expand all files Collapse all files

2
backend/src/data/questions/answer-repository.ts
View file

@ -15,7 +15,7 @@ export class AnswerRepository extends DwengoEntityRepository<Answer> {
await this.insert(answerEntity);
answerEntity.toQuestion = answer.toQuestion;
answerEntity.author = answer.author;
answerEntity.content = answer.content;
answerEntity.content = answer.content;
return answerEntity;
}
public async findAllAnswersToQuestion(question: Question): Promise<Answer[]> {

9
backend/src/services/questions.ts
View file

@ -89,9 +89,8 @@ export async function createQuestion(loId: LearningObjectIdentifier, questionDat
let assignment;
if ((typeof questionData.inGroup.assignment === "number") && (typeof questionData.inGroup.class === "string")) {
assignment = await fetchAssignment(questionData.inGroup.class,
questionData.inGroup.assignment);
if (typeof questionData.inGroup.assignment === 'number' && typeof questionData.inGroup.class === 'string') {
assignment = await fetchAssignment(questionData.inGroup.class, questionData.inGroup.assignment);
} else {
// TODO check if necessary and no conflicts to delete this if
const clazz = await getClassRepository().findById((questionData.inGroup.assignment as AssignmentDTO).within);
@ -99,14 +98,14 @@ export async function createQuestion(loId: LearningObjectIdentifier, questionDat
}
const inGroup = await getGroupRepository().findByAssignmentAndGroupNumber(assignment, questionData.inGroup.groupNumber);
const question = await questionRepository.createQuestion({
loId,
author,
inGroup: inGroup!,
content,
});
return mapToQuestionDTO(question);
}

4
backend/tests/test_assets/questions/answers.testdata.ts
View file

@ -36,7 +36,7 @@ export function makeTestAnswers(em: EntityManager, teachers: Teacher[], question
toQuestion: getQuestion07(),
sequenceNumber: 1,
timestamp: new Date(),
content: "this is a test answer"
content: 'this is a test answer',
});
const answer05 = em.create(Answer, {
@ -44,7 +44,7 @@ export function makeTestAnswers(em: EntityManager, teachers: Teacher[], question
toQuestion: getQuestion07(),
sequenceNumber: 2,
timestamp: new Date(),
content: "this is a test answer"
content: 'this is a test answer',
});
return [answer01, answer02, answer03, answer04, answer05];

6
backend/tests/test_assets/questions/questions.testdata.ts
View file

@ -73,7 +73,7 @@ export function makeTestQuestions(em: EntityManager, students: Student[], groups
timestamp: new Date(),
content: 'question',
});
question07 = em.create(Question, {
learningObjectLanguage: Language.English,
learningObjectVersion: 1,
@ -93,7 +93,7 @@ export function makeTestQuestions(em: EntityManager, students: Student[], groups
author: getTestleerling1(),
inGroup: getGroup1ConditionalLearningPath(),
timestamp: new Date(),
content: 'this is a second test question'
content: 'this is a second test question',
});
return [question01, question02, question03, question04, question05, question06, question07, question08];
@ -108,4 +108,4 @@ export function getQuestion07(): Question {
export function getQuestion08(): Question {
return question08;
}
}

4
frontend/src/components/QandA.vue
View file

@ -9,13 +9,11 @@
<template>
<div class="space-y-4">
<div
v-for="(question) in questions"
v-for="question in questions"
:key="(question.sequenceNumber, question.content)"
class="border rounded-2xl p-4 shadow-sm bg-white"
>
<SingleQuestion :question="question"></SingleQuestion>
</div>
</div>
</template>

38
frontend/src/components/QuestionNotification.vue
View file

@ -1,23 +1,31 @@
<script setup lang="ts">
import type { LearningObject } from '@/data-objects/learning-objects/learning-object';
import { useQuestionsQuery } from '@/queries/questions';
import type { LearningObjectIdentifierDTO } from '@dwengo-1/common/interfaces/learning-content';
import { languageMap } from '@dwengo-1/common/util/language';
import { computed, ref } from 'vue';
import type { LearningObject } from "@/data-objects/learning-objects/learning-object";
import { useQuestionsQuery } from "@/queries/questions";
import type { LearningObjectIdentifierDTO } from "@dwengo-1/common/interfaces/learning-content";
import { languageMap } from "@dwengo-1/common/util/language";
import { computed, ref } from "vue";
const props = defineProps<{
node: LearningObject
}>();
const props = defineProps<{
node: LearningObject;
}>();
const loid = { hruid: props.node.key, version: props.node.version, language: props.node.language} as LearningObjectIdentifierDTO;
const { data, isLoading, error} = useQuestionsQuery(loid);
const hasQuestions = computed(() => {
return (data.value?.questions.length ?? 0) > 0;
});
const loid = {
hruid: props.node.key,
version: props.node.version,
language: props.node.language,
} as LearningObjectIdentifierDTO;
const { data, isLoading, error } = useQuestionsQuery(loid);
const hasQuestions = computed(() => {
return (data.value?.questions.length ?? 0) > 0;
});
</script>
<template v-if="!isLoading & !error">
<v-icon v-if="hasQuestions" icon="mdi-help-circle-outline" color="red" size="small" />
<v-icon
v-if="hasQuestions"
icon="mdi-help-circle-outline"
color="red"
size="small"
/>
</template>
<style scoped></style>

125
frontend/src/components/SingleQuestion.vue
View file

@ -5,7 +5,7 @@
import UsingQueryResult from "./UsingQueryResult.vue";
import type { AnswersResponse } from "@/controllers/answers";
import type { AnswerData, AnswerDTO } from "@dwengo-1/common/interfaces/answer";
import authService from "@/services/auth/auth-service";
import authService from "@/services/auth/auth-service";
const props = defineProps<{
question: QuestionDTO;
@ -30,31 +30,30 @@ import authService from "@/services/auth/auth-service";
}) as QuestionId,
),
);
const questionId : QuestionId = {
const questionId: QuestionId = {
learningObjectIdentifier: props.question.learningObjectIdentifier,
sequenceNumber: props.question.sequenceNumber as number
sequenceNumber: props.question.sequenceNumber as number,
};
const createAnswerMutation = useCreateAnswerMutation(questionId);
const answer = ref('');
const answer = ref("");
function submitAnswer() {
const answerData: AnswerData = {
author: authService.authState.user?.profile.preferred_username as string,
content: answer.value
content: answer.value,
};
if (answer.value != "") {
createAnswerMutation.mutate(answerData, {
onSuccess: () => {
answer.value = "";
answersQuery.refetch();
}
},
});
} else {
alert("Please type an answer before submitting") //TODO: i18n
alert("Please type an answer before submitting"); //TODO: i18n
}
}
</script>
<template>
@ -82,15 +81,23 @@ import authService from "@/services/auth/auth-service";
>
{{ question.content }}
</div>
<div v-if="(authService.authState.activeRole === 'teacher')" class="answer-input-container">
<div
v-if="authService.authState.activeRole === 'teacher'"
class="answer-input-container"
>
<input
v-model="answer"
type="text"
placeholder="answer: ..."
class="answer-input"
v-model="answer"
type="text"
placeholder="answer: ..."
class="answer-input"
/>
<button @click="submitAnswer" class="submit-button">▶</button>
</div>
<button
@click="submitAnswer"
class="submit-button"
>
▶
</button>
</div>
<using-query-result
:query-result="answersQuery"
v-slot="answersResponse: { data: AnswersResponse }"
@ -123,9 +130,7 @@ import authService from "@/services/auth/auth-service";
justify-content: space-between;
"
>
<span class="font-semibold text-lg text-gray-800">{{
answer.author.username
}}</span>
<span class="font-semibold text-lg text-gray-800">{{ answer.author.username }}</span>
<span class="text-sm text-gray-500">{{ formatDate(answer.timestamp) }}</span>
</div>
@ -141,45 +146,45 @@ import authService from "@/services/auth/auth-service";
</div>
</template>
<style scoped>
.answer-input {
flex-grow: 1;
outline: none;
border: none;
background: transparent;
color: #374151; /* gray-700 */
font-size: 0.875rem; /* smaller font size */
}
.answer-input::placeholder {
color: #9ca3af; /* gray-400 */
}
.submit-button {
margin-left: 0.25rem;
padding: 0.25rem;
background-color: #f3f4f6; /* gray-100 */
border-radius: 9999px;
transition: background-color 0.2s;
border: none;
cursor: pointer;
}
.submit-button:hover {
background-color: #e5e7eb; /* gray-200 */
}
.submit-icon {
width: 0.75rem;
height: 0.75rem;
color: #4b5563; /* gray-600 */
}
.answer-input-container {
display: flex;
align-items: center;
border: 1px solid #d1d5db; /* gray-300 */
border-radius: 9999px;
padding: 0.5rem 1rem;
max-width: 28rem;
width: 100%;
}
.answer-input {
flex-grow: 1;
outline: none;
border: none;
background: transparent;
color: #374151; /* gray-700 */
font-size: 0.875rem; /* smaller font size */
}
.answer-input::placeholder {
color: #9ca3af; /* gray-400 */
}
.submit-button {
margin-left: 0.25rem;
padding: 0.25rem;
background-color: #f3f4f6; /* gray-100 */
border-radius: 9999px;
transition: background-color 0.2s;
border: none;
cursor: pointer;
}
.submit-button:hover {
background-color: #e5e7eb; /* gray-200 */
}
.submit-icon {
width: 0.75rem;
height: 0.75rem;
color: #4b5563; /* gray-600 */
}
.answer-input-container {
display: flex;
align-items: center;
border: 1px solid #d1d5db; /* gray-300 */
border-radius: 9999px;
padding: 0.5rem 1rem;
max-width: 28rem;
width: 100%;
}
</style>

6
frontend/src/controllers/answers.ts
View file

@ -12,13 +12,13 @@ export interface AnswerResponse {
}
export class AnswerController extends BaseController {
loId: LearningObjectIdentifierDTO;
sequenceNumber: number;
constructor(questionId: QuestionId) {
super(`learningObject/${questionId.learningObjectIdentifier.hruid}/:${questionId.learningObjectIdentifier.version}/questions/${questionId.sequenceNumber}/answers`);
super(
`learningObject/${questionId.learningObjectIdentifier.hruid}/:${questionId.learningObjectIdentifier.version}/questions/${questionId.sequenceNumber}/answers`,
);
this.loId = questionId.learningObjectIdentifier;
this.sequenceNumber = questionId.sequenceNumber;
}

150
frontend/src/views/learning-paths/LearningPathPage.vue
View file

@ -18,10 +18,10 @@
import type { LearningObjectIdentifierDTO } from "@dwengo-1/common/interfaces/learning-content";
import QandA from "@/components/QandA.vue";
import type { QuestionData, QuestionDTO } from "@dwengo-1/common/interfaces/question";
import {useStudentAssignmentsQuery, useStudentGroupsQuery} from "@/queries/students"
import { useStudentAssignmentsQuery, useStudentGroupsQuery } from "@/queries/students";
import type { AssignmentDTO } from "@dwengo-1/common/interfaces/assignment";
import type { GroupDTO } from "@dwengo-1/common/interfaces/group";
import QuestionNotification from "@/components/QuestionNotification.vue";
import type { GroupDTO } from "@dwengo-1/common/interfaces/group";
import QuestionNotification from "@/components/QuestionNotification.vue";
const router = useRouter();
const route = useRoute();
@ -146,40 +146,38 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
});
}
const studentAssignmentsQueryResult = useStudentAssignmentsQuery(authService.authState.user?.profile.preferred_username);
const studentAssignmentsQueryResult = useStudentAssignmentsQuery(
authService.authState.user?.profile.preferred_username,
);
const pathIsAssignment = computed(() => {
const assignments = studentAssignmentsQueryResult.data.value?.assignments as AssignmentDTO[] || [];
const assignments = (studentAssignmentsQueryResult.data.value?.assignments as AssignmentDTO[]) || [];
return assignments.some(
(assignment) =>
assignment.learningPath === props.hruid &&
assignment.language === props.language
(assignment) => assignment.learningPath === props.hruid && assignment.language === props.language,
);
});
const loID:LearningObjectIdentifierDTO = {
hruid: props.learningObjectHruid as string,
language: props.language
}
const createQuestionMutation = useCreateQuestionMutation(loID)
const groupsQueryResult = useStudentGroupsQuery(authService.authState.user?.profile.preferred_username)
const loID: LearningObjectIdentifierDTO = {
hruid: props.learningObjectHruid as string,
language: props.language,
};
const createQuestionMutation = useCreateQuestionMutation(loID);
const groupsQueryResult = useStudentGroupsQuery(authService.authState.user?.profile.preferred_username);
const questionInput = ref("");
function submitQuestion() {
const assignments = studentAssignmentsQueryResult.data.value?.assignments as AssignmentDTO[]
const assignments = studentAssignmentsQueryResult.data.value?.assignments as AssignmentDTO[];
const assignment = assignments.find(
(assignment) =>
assignment.learningPath === props.hruid &&
assignment.language === props.language
)
const groups = groupsQueryResult.data.value?.groups as GroupDTO[]
const group = groups?.find(group => group.assignment === assignment?.id) as GroupDTO
const questionData:QuestionData = {
(assignment) => assignment.learningPath === props.hruid && assignment.language === props.language,
);
const groups = groupsQueryResult.data.value?.groups as GroupDTO[];
const group = groups?.find((group) => group.assignment === assignment?.id) as GroupDTO;
const questionData: QuestionData = {
author: authService.authState.user?.profile.preferred_username,
content: questionInput.value,
inGroup: group //TODO: POST response zegt dat dit null is???
}
console.log(questionData)
inGroup: group, //TODO: POST response zegt dat dit null is???
};
console.log(questionData);
if (questionInput.value != "") {
createQuestionMutation.mutate(questionData, {
onSuccess: () => {
@ -187,14 +185,13 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
getQuestionsQuery.refetch(); // Reload the questions
},
onError: (e) => {
console.error(e)
console.error(e);
},
})
});
} else {
alert("Please type a question before submitting.") // TODO: i18n
alert("Please type a question before submitting."); // TODO: i18n
}
}
</script>
<template>
@ -271,12 +268,18 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
:color="COLORS[getNavItemState(node)]"
:icon="ICONS[getNavItemState(node)]"
></v-icon>
</template>
</template>
<template v-slot:append>
<QuestionNotification :node="node"></QuestionNotification>
<div>{{ (node.estimatedTime!).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false}) }}'</div>
<div>
{{
node.estimatedTime!.toLocaleString("en-US", {
minimumIntegerDigits: 2,
useGrouping: false,
})
}}'
</div>
</template>
</v-list-item>
</template>
</using-query-result>
@ -292,7 +295,10 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
</template>
</v-list-item>
<v-list-item>
<div v-if="(authService.authState.activeRole === 'student') && (pathIsAssignment)" class="assignment-indicator">
<div
v-if="authService.authState.activeRole === 'student' && pathIsAssignment"
class="assignment-indicator"
>
{{ t("assignmentIndicator") }}
</div>
</v-list-item>
@ -318,17 +324,25 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
v-if="currentNode"
></learning-object-view>
</div>
<div v-if="authService.authState.activeRole === 'student' && pathIsAssignment" class="question-box">
<div
v-if="authService.authState.activeRole === 'student' && pathIsAssignment"
class="question-box"
>
<div class="input-wrapper">
<input
type="text"
placeholder="question : ..."
class="question-input"
v-model="questionInput"
/>
<button @click="submitQuestion" class="send-button">▶</button>
<input
type="text"
placeholder="question : ..."
class="question-input"
v-model="questionInput"
/>
<button
@click="submitQuestion"
class="send-button"
>
▶
</button>
</div>
</div>
</div>
<div class="navigation-buttons-container">
<v-btn
prepend-icon="mdi-chevron-left"
@ -351,7 +365,7 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
:query-result="getQuestionsQuery"
v-slot="questionsResponse: { data: QuestionsResponse }"
>
<QandA :questions="questionsResponse.data.questions as QuestionDTO[] ?? []" />
<QandA :questions="(questionsResponse.data.questions as QuestionDTO[]) ?? []" />
</using-query-result>
</using-query-result>
</template>
@ -395,58 +409,58 @@ import QuestionNotification from "@/components/QuestionNotification.vue";
text-transform: uppercase;
z-index: 2; /* Less than modals/popups */
}
.question-box {
.question-box {
width: 100%;
max-width: 400px;
margin: 20px auto;
font-family: sans-serif;
}
.input-wrapper {
}
.input-wrapper {
display: flex;
align-items: center;
border: 1px solid #ccc;
border-radius: 999px;
padding: 8px 12px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.question-input {
}
.question-input {
flex: 1;
border: none;
outline: none;
font-size: 14px;
background-color: transparent;
}
.question-input::placeholder {
}
.question-input::placeholder {
color: #999;
}
.send-button {
}
.send-button {
background: none;
border: none;
cursor: pointer;
font-size: 16px;
color: #555;
transition: color 0.2s ease;
}
.send-button:hover {
}
.send-button:hover {
color: #000;
}
.discussion-link {
}
.discussion-link {
margin-top: 8px;
font-size: 13px;
color: #444;
}
.discussion-link a {
}
.discussion-link a {
color: #3b82f6; /* blue */
text-decoration: none;
}
.discussion-link a:hover {
}
.discussion-link a:hover {
text-decoration: underline;
}
}
</style>