refactor(web): use queries for dealing with questions

web/src/client/index.js

@@ -24,7 +24,6 @@
 import { L10nClient } from "./l10n";
 import { ManagerClient } from "./manager";
 import { StorageClient } from "./storage";
-import { QuestionsClient } from "./questions";
 import { NetworkClient } from "./network";
 import { HTTPClient, WSClient } from "./http";
 
@@ -34,7 +33,6 @@ import { HTTPClient, WSClient } from "./http";
  * @property {ManagerClient} manager - manager client.
  * @property {NetworkClient} network - network client.
  * @property {StorageClient} storage - storage client.
- * @property {QuestionsClient} questions - questions client.
  * @property {() => WSClient} ws - Agama WebSocket client.
  * @property {() => boolean} isConnected - determines whether the client is connected
  * @property {() => boolean} isRecoverable - determines whether the client is recoverable after disconnected
@@ -57,7 +55,6 @@ const createClient = (url) => {
   const manager = new ManagerClient(client);
   const network = new NetworkClient(client);
   const storage = new StorageClient(client);
-  const questions = new QuestionsClient(client);
 
   const isConnected = () => client.ws().isConnected() || false;
   const isRecoverable = () => !!client.ws().isRecoverable();
@@ -67,7 +64,6 @@ const createClient = (url) => {
     manager,
     network,
     storage,
-    questions,
     isConnected,
     isRecoverable,
     onConnect: (handler) => client.ws().onOpen(handler),

web/src/components/questions/GenericQuestion.test.jsx → web/src/components/questions/GenericQuestion.test.tsx

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2022] SUSE LLC
+ * Copyright (c) [2022-2024] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -21,10 +21,11 @@
 
 import React from "react";
 import { screen } from "@testing-library/react";
-import { installerRender } from "~/test-utils";
-import { GenericQuestion } from "~/components/questions";
+import { plainRender } from "~/test-utils";
+import { Question } from "~/types/questions";
+import GenericQuestion from "~/components/questions/GenericQuestion";
 
-const question = {
+const question: Question = {
   id: 1,
   text: "Do you write unit tests?",
   options: ["always", "sometimes", "never"],
@@ -34,7 +35,7 @@ const question = {
 const answerFn = jest.fn();
 
 const renderQuestion = () =>
-  installerRender(<GenericQuestion question={question} answerCallback={answerFn} />);
+  plainRender(<GenericQuestion question={question} answerCallback={answerFn} />);
 
 describe("GenericQuestion", () => {
   it("renders the question text", async () => {

web/src/components/questions/GenericQuestion.jsx → web/src/components/questions/GenericQuestion.tsx

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2022] SUSE LLC
+ * Copyright (c) [2022-2024] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -22,11 +22,24 @@
 import React from "react";
 import { Text } from "@patternfly/react-core";
 import { Popup } from "~/components/core";
-import { QuestionActions } from "~/components/questions";
+import { AnswerCallback, Question } from "~/types/questions";
+import QuestionActions from "~/components/questions/QuestionActions";
 import { _ } from "~/i18n";
 
-export default function GenericQuestion({ question, answerCallback }) {
-  const actionCallback = (option) => {
+/**
+ * Component for rendering generic questions
+ *
+ * @param question - the question to be answered
+ * @param answerCallback - the callback to be triggered on answer
+ */
+export default function GenericQuestion({
+  question,
+  answerCallback,
+}: {
+  question: Question;
+  answerCallback: AnswerCallback;
+}): React.ReactNode {
+  const actionCallback = (option: string) => {
     question.answer = option;
     answerCallback(question);
   };