From 89ab40b652ea090f6bf5161a3b14df65ac2befe3 Mon Sep 17 00:00:00 2001 From: ZecD Date: Thu, 8 Aug 2024 11:39:37 +0200 Subject: [PATCH] changed flow, removed steps to align to unguess tagging tool --- src/pages/UxDashboard/ResultsPage/index.tsx | 2 +- src/pages/UxDashboard/Sidebar.tsx | 172 +++++++----------- src/pages/UxDashboard/UxForm/FormProvider.tsx | 9 +- src/pages/UxDashboard/index.tsx | 41 +---- .../components/table/VisibilityIcon.tsx | 2 +- src/services/tryberApi/index.ts | 45 +++-- src/utils/schema.ts | 53 +++--- 7 files changed, 129 insertions(+), 195 deletions(-) diff --git a/src/pages/UxDashboard/ResultsPage/index.tsx b/src/pages/UxDashboard/ResultsPage/index.tsx index 5d2f6335..db4ea6b2 100644 --- a/src/pages/UxDashboard/ResultsPage/index.tsx +++ b/src/pages/UxDashboard/ResultsPage/index.tsx @@ -52,7 +52,7 @@ const ResultsPage = () => { saveDashboard({ campaign: id, body: { - status: "publish", + visible: 1, }, }) .unwrap() diff --git a/src/pages/UxDashboard/Sidebar.tsx b/src/pages/UxDashboard/Sidebar.tsx index e063f9d2..2202c1ce 100644 --- a/src/pages/UxDashboard/Sidebar.tsx +++ b/src/pages/UxDashboard/Sidebar.tsx @@ -1,21 +1,15 @@ -import { - Card, - Button, - Text, - Steps, -} from "@appquality/appquality-design-system"; +import { Button, Card, Steps } from "@appquality/appquality-design-system"; import { useFormikContext } from "formik"; -import { FormValuesInterface } from "./UxForm/FormProvider"; -import { usePatchCampaignsByCampaignUxMutation } from "src/services/tryberApi"; import { useParams } from "react-router-dom"; import siteWideMessageStore from "src/redux/siteWideMessages"; +import { usePatchCampaignsByCampaignUxMutation } from "src/services/tryberApi"; import { useAppDispatch, useAppSelector } from "src/store"; import { setCurrentFormSection, - setCurrentStep, setIsProgrammaticallyScrolling, setPublishStatus, } from "./uxDashboardSlice"; +import { FormValuesInterface } from "./UxForm/FormProvider"; const Sidebar = () => { const { id } = useParams<{ id: string }>(); @@ -23,12 +17,13 @@ const Sidebar = () => { const { submitForm, values, isSubmitting, isValid } = useFormikContext(); const [saveDashboard] = usePatchCampaignsByCampaignUxMutation(); - const { currentStep, currentFormSection, publishStatus } = useAppSelector( + const { currentFormSection, publishStatus } = useAppSelector( (state) => state.uxDashboard ); const dispatch = useAppDispatch(); const handleSaveDraft = () => { + values.visible = 0; submitForm(); if (!isValid) { add({ @@ -38,102 +33,75 @@ const Sidebar = () => { } }; - if (currentStep >= 2) return null; + const handlePublish = async () => { + dispatch(setPublishStatus("publishing")); + await saveDashboard({ + campaign: id, + body: { + visible: 1, + }, + }) + .unwrap() + .then((res) => { + dispatch(setPublishStatus("success")); + add({ + type: "success", + message: `Dashboard published`, + expire: 8, + }); + }) + .catch((err) => { + dispatch(setPublishStatus("failed")); + }); + }; return (
- {currentStep === 0 && ( - <> - - - Per pubblicare passa prima dalla preview - - - - )} - {currentStep === 1 && ( - <> - - - Pubblica per rendere disponibile la dashboard anche al cliente - - - - )} - - {currentStep === 0 && ( - - { - if (index === current) return; - dispatch(setCurrentFormSection(index)); - dispatch(setIsProgrammaticallyScrolling(true)); - }} + <> + + + + + + + { + if (index === current) return; + dispatch(setCurrentFormSection(index)); + dispatch(setIsProgrammaticallyScrolling(true)); + }} + > + + + + +
); }; diff --git a/src/pages/UxDashboard/UxForm/FormProvider.tsx b/src/pages/UxDashboard/UxForm/FormProvider.tsx index bf8244eb..cfbbac59 100644 --- a/src/pages/UxDashboard/UxForm/FormProvider.tsx +++ b/src/pages/UxDashboard/UxForm/FormProvider.tsx @@ -27,7 +27,7 @@ export interface FormSentiment { comment: string; } export interface FormValuesInterface { - status?: GetCampaignsByCampaignUxApiResponse["status"]; + visible?: GetCampaignsByCampaignUxApiResponse["visible"]; goal: GetCampaignsByCampaignUxApiResponse["goal"]; methodology: GetCampaignsByCampaignUxApiResponse["methodology"]; questions: FormQuestion[]; @@ -48,10 +48,9 @@ const FormProvider = ({ children }: { children: ReactNode }) => { }); const { data: campaignData, isLoading: campaignDataLoading } = useGetCampaignsByCampaignQuery({ campaign: id }); - const initialValues: FormValuesInterface = useMemo( () => ({ - status: currentData?.status, + visible: currentData?.visible ?? undefined, goal: currentData?.goal || "", methodology: currentData?.methodology || { name: campaignData?.type || "", @@ -91,7 +90,7 @@ const FormProvider = ({ children }: { children: ReactNode }) => { } const validationSchema = object({ - status: string(), + visible: number(), goal: string().required("Campo obbligatorio"), methodology: object().shape({ name: string(), @@ -164,13 +163,13 @@ const FormProvider = ({ children }: { children: ReactNode }) => { initialValues={initialValues} enableReinitialize onSubmit={async (values, formikHelpers) => { - // todo: better typing for values because validationSchema prevent usersNumber to be undefined if (values.usersNumber === undefined) return; formikHelpers.setSubmitting(true); const res = await saveDashboard({ campaign: id, body: { + visible: values.visible, goal: values.goal, questions: values.questions.map((question) => ({ id: question.id, diff --git a/src/pages/UxDashboard/index.tsx b/src/pages/UxDashboard/index.tsx index 9aa101c9..4dfbc503 100644 --- a/src/pages/UxDashboard/index.tsx +++ b/src/pages/UxDashboard/index.tsx @@ -3,27 +3,17 @@ import { BSGrid, Container, PageTitle, - Steps, Title, } from "@appquality/appquality-design-system"; +import { useParams } from "react-router-dom"; import ErrorUnauthorized from "src/features/ErrorUnauthorized/ErrorUnauthorized"; +import { PageTemplate } from "src/features/PageTemplate"; import { useGetCampaignsByCampaignQuery } from "src/services/tryberApi"; -import UxDashboardForm from "./UxForm"; -import { useParams } from "react-router-dom"; -import Preview from "./Preview"; -import Sidebar from "./Sidebar"; -import FormProvider from "./UxForm/FormProvider"; -import ResultsPage from "./ResultsPage"; -import { useAppSelector } from "src/store"; import styled from "styled-components"; -import { PageTemplate } from "src/features/PageTemplate"; +import Sidebar from "./Sidebar"; import useCanSee from "./useCanSee"; - -const StyledSteps = styled(Steps)` - .step-status-icon { - background-color: ${({ theme }) => theme.colors.gray100}; - } -`; +import UxDashboardForm from "./UxForm"; +import FormProvider from "./UxForm/FormProvider"; const ResponsiveCol = styled(BSCol)<{ lgOrder: number }>` @media (min-width: ${({ theme }) => theme.grid.breakpoints.lg}) { @@ -33,7 +23,6 @@ const ResponsiveCol = styled(BSCol)<{ lgOrder: number }>` const UxDashboard = () => { const { id } = useParams<{ id: string }>(); - const { currentStep } = useAppSelector((state) => state.uxDashboard); const { isError, isLoading, hasPermission } = useCanSee(id); @@ -53,7 +42,6 @@ const UxDashboard = () => { } if (hasPermission) { - // todo: discuss about appq_video_dashboard permission (change tests) return ( @@ -75,24 +63,7 @@ const UxDashboard = () => { - - - 0} - title={"Preview"} - /> - 1} - title={"Publish"} - /> - - {currentStep === 0 && } - {currentStep === 1 && } - {currentStep === 2 && } + diff --git a/src/pages/campaigns/components/table/VisibilityIcon.tsx b/src/pages/campaigns/components/table/VisibilityIcon.tsx index bc944387..5b5b24e8 100644 --- a/src/pages/campaigns/components/table/VisibilityIcon.tsx +++ b/src/pages/campaigns/components/table/VisibilityIcon.tsx @@ -31,7 +31,7 @@ const Target = styled(icons.PersonVideo2)` color: ${({ theme }) => theme.variants.primary}}; `; -type Visibility = "public" | "smallgroup" | "logged" | "admin"; +type Visibility = "public" | "smallgroup" | "logged" | "admin" | "target"; const VisibilityIcon = ({ visibility }: { visibility: Visibility }) => { if (visibility === "public") return ; diff --git a/src/services/tryberApi/index.ts b/src/services/tryberApi/index.ts index 63e10604..55dd760e 100644 --- a/src/services/tryberApi/index.ts +++ b/src/services/tryberApi/index.ts @@ -1043,7 +1043,7 @@ export type GetCampaignsApiResponse = /** status 200 OK */ { startDate?: string; endDate?: string; status?: "running" | "closed" | "incoming"; - visibility?: "admin" | "smallgroup" | "logged" | "public"; + visibility?: "admin" | "smallgroup" | "logged" | "public" | "target"; resultType?: "bug" | "bugparade" | "no"; csm?: { id: number; @@ -1463,7 +1463,6 @@ export type PutCampaignsByCampaignTasksAndTaskApiArg = { }; export type GetCampaignsByCampaignUxApiResponse = /** status 200 A UseCase linked with the Campaign */ { - status: "draft" | "published" | "draft-modified"; goal: string; usersNumber: number; sentiments: { @@ -1484,6 +1483,7 @@ export type GetCampaignsByCampaignUxApiResponse = id: number; name: string; }[]; + visible: number; }; export type GetCampaignsByCampaignUxApiArg = { /** A campaign id */ @@ -1493,28 +1493,25 @@ export type PatchCampaignsByCampaignUxApiResponse = /** status 200 OK */ {}; export type PatchCampaignsByCampaignUxApiArg = { /** A campaign id */ campaign: string; - body: - | { - goal: string; - usersNumber: number; - sentiments: { - id?: number; - clusterId: number; - value: number; - comment: string; - }[]; - methodology: { - type: "qualitative" | "quantitative" | "quali-quantitative"; - description: string; - }; - questions: { - id?: number; - name: string; - }[]; - } - | { - status: "publish"; - }; + body: { + goal?: string; + usersNumber?: number; + visible?: number; + methodology?: { + description: string; + type: string; + }; + sentiments?: { + clusterId: number; + value: number; + comment: string; + id?: number; + }[]; + questions?: { + name: string; + id?: number; + }[]; + }; }; export type PostCampaignsFormsApiResponse = /** status 201 Created */ { id: number; diff --git a/src/utils/schema.ts b/src/utils/schema.ts index 2d370b23..865186cb 100644 --- a/src/utils/schema.ts +++ b/src/utils/schema.ts @@ -1238,7 +1238,12 @@ export interface operations { /** @enum {string} */ status?: "running" | "closed" | "incoming"; /** @enum {string} */ - visibility?: "admin" | "smallgroup" | "logged" | "public"; + visibility?: + | "admin" + | "smallgroup" + | "logged" + | "public" + | "target"; /** @enum {string} */ resultType?: "bug" | "bugparade" | "no"; csm?: { @@ -1951,8 +1956,6 @@ export interface operations { 200: { content: { "application/json": { - /** @enum {string} */ - status: "draft" | "published" | "draft-modified"; goal: string; usersNumber: number; sentiments: { @@ -1974,6 +1977,7 @@ export interface operations { id: number; name: string; }[]; + visible: number; }; }; }; @@ -2000,30 +2004,25 @@ export interface operations { }; requestBody: { content: { - "application/json": - | { - goal: string; - usersNumber: number; - sentiments: { - id?: number; - clusterId: number; - value: number; - comment: string; - }[]; - methodology: { - /** @enum {string} */ - type: "qualitative" | "quantitative" | "quali-quantitative"; - description: string; - }; - questions: { - id?: number; - name: string; - }[]; - } - | { - /** @enum {string} */ - status: "publish"; - }; + "application/json": { + goal?: string; + usersNumber?: number; + visible?: number; + methodology?: { + description: string; + type: string; + }; + sentiments?: { + clusterId: number; + value: number; + comment: string; + id?: number; + }[]; + questions?: { + name: string; + id?: number; + }[]; + }; }; }; };