Merge pull request #724 from AppQuality/develop

Add bug comments chat

package.json

@@ -3,10 +3,10 @@
   "version": "1.4.0",
   "private": true,
   "dependencies": {
-    "@appquality/unguess-design-system": "3.1.54",
+    "@appquality/unguess-design-system": "3.1.63",
     "@headwayapp/react-widget": "^0.0.4",
     "@reduxjs/toolkit": "^1.8.0",
-    "@rtk-query/codegen-openapi": "^1.0.0-alpha.1",
+    "@rtk-query/codegen-openapi": "1.2.0",
     "@sentry/react": "^7.85.0",
     "@zendeskgarden/react-datepickers": "^8.49.4",
     "@zendeskgarden/react-dropdowns": "^8.49.0",

src/common/components/BugDetail/Details.tsx

@@ -24,7 +24,6 @@ const Title = styled.div`
 
 export default ({
   bug,
-  refetchBugTags,
 }: {
   bug: Bug & {
     reporter: {
@@ -33,7 +32,6 @@ export default ({
     };
     additional_fields?: BugAdditionalField[];
   };
-  refetchBugTags?: () => void;
 }) => {
   const { t } = useTranslation();
   const { openAccordions, setOpenAccordions } = useBugPreviewContext();
@@ -71,7 +69,7 @@ export default ({
             </Accordion.Label>
           </Accordion.Header>
           <Accordion.Panel style={{ padding: 0 }}>
-            <DetailsItems bug={bug} refetchBugTags={refetchBugTags} />
+            <DetailsItems bug={bug} />
           </Accordion.Panel>
         </Accordion.Section>
       </Accordion>

src/common/components/BugDetail/DetailsItems.tsx

@@ -1,7 +1,6 @@
 import styled from 'styled-components';
 import { appTheme } from 'src/app/theme';
 import { SeverityTag } from 'src/common/components/tag/SeverityTag';
-import BugTags from 'src/common/components/BugDetail/Tags';
 import { Bug, BugAdditionalField } from 'src/features/api';
 import { MD, Span } from '@appquality/unguess-design-system';
 import { Trans, useTranslation } from 'react-i18next';
@@ -23,8 +22,6 @@ const StyledSpan = styled(Span)`
 
 export default ({
   bug,
-  isLightbox,
-  refetchBugTags,
 }: {
   bug: Bug & {
     reporter: {
@@ -33,8 +30,6 @@ export default ({
     };
     additional_fields?: BugAdditionalField[];
   };
-  isLightbox?: boolean;
-  refetchBugTags?: () => void;
 }) => {
   const { t } = useTranslation();
   const { occurred_date, device, reporter } = bug;
@@ -43,11 +38,6 @@ export default ({
 
   return (
     <>
-      {!isLightbox && (
-        <DetailsItem>
-          <BugTags bug={bug} refetchBugTags={refetchBugTags} />
-        </DetailsItem>
-      )}
       <DetailsItem>
         <MD isBold style={{ marginBottom: appTheme.space.xs }}>
           {t('__BUGS_PAGE_BUG_DETAIL_DETAILS_BUG_TIME_LABEL')}

src/common/components/BugDetail/lightbox.tsx

@@ -106,7 +106,7 @@ export const LightboxContainer = ({
           <Lightbox.Body.Details style={{ flex: 1 }}>
             <BugMeta bug={bug} />
             <BugDescription bug={bug} />
-            <DetailsItems isLightbox bug={bug} />
+            <DetailsItems bug={bug} />
           </Lightbox.Body.Details>
         )}
       </Lightbox.Body>

src/common/components/navigation/header/utils.ts

@@ -1,4 +1,5 @@
 export const getInitials = (name: string) => {
+  if (!name) return 'User';
   const names = name.split(' ');
   const initials = names[0][0] + names[names.length - 1][0];
   return initials;

src/features/api/api.ts

@@ -1,11 +1,6 @@
 import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
 import { stringify } from 'qs';
-import {
-  GetCampaignsByCidApiResponse,
-  GetProjectsByPidApiResponse,
-  GetWorkspacesByWidApiResponse,
-  Template,
-} from '.';
+import { Template } from '.';
 
 export const apiSlice = createApi({
   reducerPath: 'api',

src/features/api/apiTags.ts

@@ -83,6 +83,31 @@ unguessApi.enhanceEndpoints({
     patchCampaignsByCidCustomStatuses: {
       invalidatesTags: ['CustomStatuses', 'Bugs', 'Tags'],
     },
+    postCampaignsByCidBugsAndBidComments: {
+      async onQueryStarted(
+        { cid, bid, ...post },
+        { dispatch, queryFulfilled }
+      ) {
+        try {
+          const { data: updatedPost } = await queryFulfilled;
+          dispatch(
+            unguessApi.util.updateQueryData(
+              'getCampaignsByCidBugsAndBidComments',
+              { cid, bid },
+              (draft) => {
+                draft.items.push(updatedPost);
+              }
+            )
+          );
+        } catch {
+          /**
+           * TODO: on failure invalidate the corresponding cache tags
+           * to trigger a re-fetch:
+           * dispatch(api.util.invalidateTags(['BugComments']))
+           */
+        }
+      },
+    },
   },
 });
 

src/features/api/index.ts

@@ -450,6 +450,34 @@ const injectedRtkApi = api.injectEndpoints({
     getMediaById: build.query<GetMediaByIdApiResponse, GetMediaByIdApiArg>({
       query: (queryArg) => ({ url: `/media/${queryArg.id}` }),
     }),
+    getCampaignsByCidBugsAndBidComments: build.query<
+      GetCampaignsByCidBugsAndBidCommentsApiResponse,
+      GetCampaignsByCidBugsAndBidCommentsApiArg
+    >({
+      query: (queryArg) => ({
+        url: `/campaigns/${queryArg.cid}/bugs/${queryArg.bid}/comments`,
+      }),
+    }),
+    postCampaignsByCidBugsAndBidComments: build.mutation<
+      PostCampaignsByCidBugsAndBidCommentsApiResponse,
+      PostCampaignsByCidBugsAndBidCommentsApiArg
+    >({
+      query: (queryArg) => ({
+        url: `/campaigns/${queryArg.cid}/bugs/${queryArg.bid}/comments`,
+        method: 'POST',
+        body: queryArg.body,
+      }),
+    }),
+    deleteCampaignsByCidBugsAndBidCommentsCmid: build.mutation<
+      DeleteCampaignsByCidBugsAndBidCommentsCmidApiResponse,
+      DeleteCampaignsByCidBugsAndBidCommentsCmidApiArg
+    >({
+      query: (queryArg) => ({
+        url: `/campaigns/${queryArg.cid}/bugs/${queryArg.bid}/comments/${queryArg.cmid}`,
+        method: 'DELETE',
+        body: queryArg.body,
+      }),
+    }),
   }),
   overrideExisting: false,
 });
@@ -1116,6 +1144,35 @@ export type GetMediaByIdApiResponse = unknown;
 export type GetMediaByIdApiArg = {
   id: string;
 };
+export type GetCampaignsByCidBugsAndBidCommentsApiResponse =
+  /** status 200 OK */ {
+    items: BugComment[];
+  };
+export type GetCampaignsByCidBugsAndBidCommentsApiArg = {
+  /** Campaign id */
+  cid: string;
+  /** Defines an identifier for the bug object (BUG ID) */
+  bid: string;
+};
+export type PostCampaignsByCidBugsAndBidCommentsApiResponse =
+  /** status 200 OK */ BugComment;
+export type PostCampaignsByCidBugsAndBidCommentsApiArg = {
+  /** Campaign id */
+  cid: string;
+  /** Defines an identifier for the bug object (BUG ID) */
+  bid: string;
+  body: {
+    text: string;
+  };
+};
+export type DeleteCampaignsByCidBugsAndBidCommentsCmidApiResponse =
+  /** status 200 OK */ string;
+export type DeleteCampaignsByCidBugsAndBidCommentsCmidApiArg = {
+  cid: string;
+  bid: string;
+  cmid: string;
+  body: {};
+};
 export type Error = {
   message: string;
   code: number;
@@ -1455,6 +1512,15 @@ export type Coin = {
   created_on?: string;
   updated_on?: string;
 };
+export type BugComment = {
+  id: number;
+  text: string;
+  creation_date: string;
+  creator: {
+    id: number;
+    name: string;
+  };
+};
 export const {
   useGetQuery,
   usePostAuthenticateMutation,
@@ -1507,4 +1573,7 @@ export const {
   usePostWorkspacesByWidUsersMutation,
   useDeleteWorkspacesByWidUsersMutation,
   useGetMediaByIdQuery,
+  useGetCampaignsByCidBugsAndBidCommentsQuery,
+  usePostCampaignsByCidBugsAndBidCommentsMutation,
+  useDeleteCampaignsByCidBugsAndBidCommentsCmidMutation,
 } = injectedRtkApi;

src/hooks/useFeatureFlag.ts

@@ -0,0 +1,17 @@
+import { useAppSelector } from 'src/app/hooks';
+
+export const useFeatureFlag = () => {
+  const { userData: user } = useAppSelector((state) => state.user);
+
+  const hasFeatureFlag = (slug?: string) => {
+    if (user && user.role === 'administrator') {
+      return true;
+    }
+    if (user && user.features) {
+      return user.features.some((feature) => feature.slug === slug);
+    }
+    return false;
+  };
+
+  return { hasFeatureFlag };
+};

src/locales/en/translation.json

@@ -25,13 +25,25 @@
   "__APP_SIDEBAR_SHARED_WORKSPACE_HOME_ITEM_LABEL": "Campaigns",
   "__APP_SIDEBAR_SHARED_WORKSPACE_LABEL": "Shared with me",
   "__BREADCRUMB_ITEM_SERVICES": "Services",
+  "__BUG_COMMENTS_CHAT_CANCEL__": "Cancel",
+  "__BUG_COMMENTS_CHAT_CONFIRM__": "Send",
+  "__BUG_COMMENTS_CHAT_DELETE__": "Delete",
+  "__BUG_COMMENTS_CHAT_HEADER__": "Talk to UNGUESS and its team",
+  "__BUG_COMMENTS_CHAT_PLACEHOLDER": "Write and share your opinion or feedback",
+  "__BUG_COMMENTS_DELETE_MODAL_BODY__": "If you delete it, it will no longer appear in the comments.",
+  "__BUG_COMMENTS_DELETE_MODAL_CANCEL__": "Back to comment",
+  "__BUG_COMMENTS_DELETE_MODAL_DELETE__": "Delete",
+  "__BUG_COMMENTS_DELETE_MODAL_HEADER__": "Do you want to delete this comment?",
   "__BUG_CUSTOM_STATUS_NOT_A_BUG": "Not a bug",
   "__BUG_CUSTOM_STATUS_OPEN": "Open",
   "__BUG_CUSTOM_STATUS_PENDING": "Pending",
   "__BUG_CUSTOM_STATUS_SOLVED": "Solved",
   "__BUG_CUSTOM_STATUS_TO_BE_IMPORTED": "To be imported",
   "__BUG_CUSTOM_STATUS_TO_BE_REGISTERED": "To be retested",
   "__BUG_CUSTOM_STATUS_TO_DO": "To do",
+  "__BUG_PAGE_ACTIONS_TITLE": "Manage the bug independently",
+  "__BUG_PAGE_BUG_COMMENTS_BUTTON_TEXT_EMPTY": "Be the first to write one comment!",
+  "__BUG_PAGE_BUG_COMMENTS_BUTTON_TEXT_EXISTING": "Read all comments",
   "__BUG_PAGE_HEADER_SHARE_LINK_CTA": "Share public link",
   "__BUG_PRIORITY_HIGH": "High",
   "__BUG_PRIORITY_HIGHEST": "Highest",
@@ -61,6 +73,9 @@
   "__BUGS_ORDER_LOWEST_TO_HIGHEST": "By lowest to highest",
   "__BUGS_OS_FILTER_ITEM_NO_ITEMS": "OS",
   "__BUGS_PAGE_BUG_CARD_DUPLICATES_LABEL": "Duplicates",
+  "__BUGS_PAGE_BUG_COMMENTS_EMPTY_TEXT": "There are no comments yet.",
+  "__BUGS_PAGE_BUG_COMMENTS_EXISITING_TEXT": "There are comments on this bug.",
+  "__BUGS_PAGE_BUG_COMMENTS_TITLE": "Comments",
   "__BUGS_PAGE_BUG_DETAIL_ADDITIONAL_NOTES_LABEL": "Additional notes",
   "__BUGS_PAGE_BUG_DETAIL_ATTACHMENTS_DOWNLOAD_BUTTON": "Download this media",
   "__BUGS_PAGE_BUG_DETAIL_ATTACHMENTS_EXTRA_TAB_ITEM_LABEL": "File extra",
@@ -83,7 +98,7 @@
   "__BUGS_PAGE_BUG_DETAIL_DETAILS_BUG_TIME_LABEL": "Detection date",
   "__BUGS_PAGE_BUG_DETAIL_DETAILS_BUG_TIPOLOGY_LABEL": "Tipology",
   "__BUGS_PAGE_BUG_DETAIL_DETAILS_BUG_USE_CASE_LABEL": "Use Case",
-  "__BUGS_PAGE_BUG_DETAIL_DETAILS_LABEL": "Tags and Details",
+  "__BUGS_PAGE_BUG_DETAIL_DETAILS_LABEL": "Details",
   "__BUGS_PAGE_BUG_DETAIL_DUPLICATES_ACCORDION_TITLE": "Related bugs",
   "__BUGS_PAGE_BUG_DETAIL_EXPECTED_RESULT_LABEL": "Expected result",
   "__BUGS_PAGE_BUG_DETAIL_NEED_REVIEW": "Under revision",
@@ -216,6 +231,9 @@
   "__BUGS_PAGE_USECASE_COMPLETION_3_TOOLTIP": "We are doing the last checks on this Use Case",
   "__BUGS_PAGE_USECASE_COMPLETION_4": "<0>Use Case <1>completed</1></0>",
   "__BUGS_PAGE_USECASE_COMPLETION_4_TOOLTIP": "We are ready with this Use Case: view all the bugs",
+  "__BUGS_PAGE_VIEW_BUG_COMMENTS_TOOLTIP_one": "{{count}} comment in bug details page",
+  "__BUGS_PAGE_VIEW_BUG_COMMENTS_TOOLTIP_other": "{{count}} comments in bug details page",
+  "__BUGS_PAGE_VIEW_BUG_COMMENTS_TOOLTIP_EMPTY": "There are no comments yet",
   "__BUGS_PAGE_VIEW_BUG_TOOLTIP": "Open bug",
   "__BUGS_PAGE_WARNING_POSSIBLE_EMPTY_CASES": "As of now we couldn't find any more bugs in other use cases",
   "__BUGS_PAGE_WARNING_POSSIBLE_EMPTY_STATUS": "As of now we couldn't find any more bugs in other statuses",