Skip to content

Commit 711bd29

Browse files
marcbonmarcbon
authored
Merge branch 'UN-93' into UN-94-page-header
2 parents a38401b + 104a998 commit 711bd29

File tree

16 files changed

+417
-247
lines changed

16 files changed

+417
-247
lines changed

‎src/assets/emptyReports.svg‎

Lines changed: 0 additions & 42 deletions
This file was deleted.

‎src/common/components/StickyContainer.tsx‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { ContainerCard } from '@appquality/unguess-design-system';
2+
import styled from 'styled-components';
3+
4+
export const StickyContainer = styled(ContainerCard)`
5+
position: sticky;
6+
top: ${({ theme }) => theme.space.md};
7+
z-index: 1;
8+
padding: ${({ theme }) => theme.space.base * 6}px;
9+
background-color: ${({ theme }) => theme.palette.white};
10+
`;

‎src/common/components/navigation.tsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import styled from 'styled-components';
2+
import { Divider } from 'src/common/components/divider';
3+
import { Link } from 'react-scroll';
4+
import { MD } from '@appquality/unguess-design-system';
5+
6+
export const StyledDivider = styled(Divider)`
7+
margin-top: ${({ theme }) => theme.space.base * 3}px;
8+
margin-bottom: ${({ theme }) => theme.space.base * 6}px;
9+
`;
10+
11+
export const StickyNavItem = styled(Link)`
12+
display: flex;
13+
align-items: center;
14+
justify-content: flex-start;
15+
border-top-left-radius: ${({ theme }) => theme.space.lg};
16+
border-bottom-left-radius: ${({ theme }) => theme.space.lg};
17+
padding: ${({ theme }) => theme.space.sm} ${({ theme }) => theme.space.md};
18+
cursor: pointer;
19+
color: ${({ theme }) => theme.palette.blue[600]};
20+
margin: ${({ theme }) => theme.space.sm} 0;
21+
background-color: transparent;
22+
transition: background-color 0.1s ease-in-out;
23+
text-decoration: none;
24+
25+
&:hover {
26+
color: ${({ theme }) => theme.palette.blue[700]};
27+
background-color: ${({ theme }) => theme.palette.kale[100]};
28+
transition: all 0.1s ease-in-out;
29+
text-decoration: none;
30+
}
31+
32+
&.active {
33+
color: ${({ theme }) => theme.palette.blue[700]};
34+
background-color: ${({ theme }) => theme.palette.kale[100]};
35+
font-weight: ${({ theme }) => theme.fontWeights.medium};
36+
}
37+
`;
38+
39+
export const StickyNavItemLabel = styled(MD)`
40+
color: ${({ theme }) => theme.palette.blue[700]};
41+
font-weight: ${({ theme }) => theme.fontWeights.medium};
42+
`;

‎src/features/bugsReport/BugsReportCard.tsx‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import { Button, SpecialCard, theme } from '@appquality/unguess-design-system';
2+
import { useTranslation } from 'react-i18next';
3+
import { ReactComponent as ExcelIcon } from 'src/assets/icons/file-icon-excel.svg';
4+
import { ReactComponent as DownloadIcon } from 'src/assets/icons/download-stroke.svg';
5+
import queryString from 'query-string';
6+
7+
export const BugsReportCard = ({
8+
campaignId,
9+
title,
10+
}: {
11+
campaignId: number;
12+
title: string;
13+
}) => {
14+
const { t } = useTranslation();
15+
const getReport = () => {
16+
fetch(`${process.env.REACT_APP_CROWD_WP_URL}/wp-admin/admin-ajax.php`, {
17+
method: 'POST',
18+
headers: {
19+
'Content-Type': 'application/x-www-form-urlencoded',
20+
Accept: 'application/json',
21+
},
22+
body: queryString.stringify({
23+
action: 'bugs_excel',
24+
project: campaignId,
25+
type: 'campaign',
26+
title,
27+
}),
28+
})
29+
.then((res) => res.json())
30+
.then((data) => {
31+
if (data.success) {
32+
window.location.href = `${process.env.REACT_APP_CROWD_WP_URL}/wp-content/themes/unguess/report/temp/${data.file}`;
33+
} else {
34+
// eslint-disable-next-line no-console
35+
console.error(data);
36+
}
37+
})
38+
.catch((error) => {
39+
// eslint-disable-next-line no-console
40+
console.error('error', error);
41+
});
42+
};
43+
44+
return (
45+
<SpecialCard>
46+
<SpecialCard.Meta
47+
justifyContent="start"
48+
style={{ fontSize: theme.fontSizes.sm }}
49+
>
50+
{t('__CAMPAIGN_GENERATE_REPORT_CARD_META')}
51+
</SpecialCard.Meta>
52+
53+
<SpecialCard.Thumb>
54+
<ExcelIcon />
55+
</SpecialCard.Thumb>
56+
57+
<SpecialCard.Header>
58+
<SpecialCard.Header.Label>
59+
{t('__CAMPAIGN_PAGE_REPORTS_FILE_TYPE_EXCEL')}
60+
</SpecialCard.Header.Label>
61+
<SpecialCard.Header.Title>{title}</SpecialCard.Header.Title>
62+
</SpecialCard.Header>
63+
64+
<SpecialCard.Footer direction="column" justifyContent="center">
65+
<Button
66+
className="report-btn report-btn-link report-btn-link"
67+
isPill
68+
isStretched
69+
onClick={getReport}
70+
>
71+
<Button.StartIcon>
72+
<DownloadIcon />
73+
</Button.StartIcon>
74+
{t('__CAMPAIGN_GENERATE_REPORT_CARD_BUTTON_LABEL')}
75+
</Button>
76+
</SpecialCard.Footer>
77+
</SpecialCard>
78+
);
79+
};

‎src/features/navigation/Navigation.tsx‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import {
1212
setWorkspace,
1313
toggleProfileModal,
1414
setProfileModalOpen,
15+
setSidebarOpen,
1516
} from 'src/features/navigation/navigationSlice';
1617
import WPAPI from 'src/common/wpapi';
1718
import i18n from 'src/i18n';
@@ -45,6 +46,15 @@ export const Navigation = ({
4546
(state) => state.navigation
4647
);
4748

49+
// Set isSidebarOpen to false if the route is "campaigns"
50+
useEffect(() => {
51+
if (route === 'campaigns') {
52+
dispatch(setSidebarOpen(false));
53+
} else {
54+
dispatch(setSidebarOpen(true));
55+
}
56+
}, [route]);
57+
4858
useEffect(() => {
4959
if (workspaces && !activeWorkspace) {
5060
const fetchWS = async () => {

‎src/features/navigation/navigationSlice.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@ const navigationSlice = createSlice({
1818
toggleSidebar: (state) => {
1919
state.isSidebarOpen = !state.isSidebarOpen;
2020
},
21+
closeSidebar: (state) => {
22+
state.isSidebarOpen = false;
23+
},
24+
setSidebarOpen: (state, action) => {
25+
state.isSidebarOpen = action.payload;
26+
},
2127
toggleProfileModal: (state) => {
2228
state.isProfileModalOpen = !state.isProfileModalOpen;
2329
},
@@ -32,6 +38,8 @@ export const {
3238
toggleSidebar,
3339
toggleProfileModal,
3440
setProfileModalOpen,
41+
closeSidebar,
42+
setSidebarOpen,
3543
} = navigationSlice.actions;
3644

3745
export default navigationSlice.reducer;

‎src/hooks/useLocalizeDashboardUrl.ts‎

Lines changed: 29 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,30 @@ const isReactCampaign = (outputs: Output[]): boolean => {
1515
return isReact;
1616
};
1717

18+
export const getLocalizedFunctionalDashboardUrl = (
19+
aCampaignId: number,
20+
aLanguage: string
21+
): string =>
22+
aLanguage === 'en'
23+
? `${
24+
process.env.REACT_APP_CROWD_WP_URL ?? ''
25+
}/functional-customer-dashboard/?cid=${aCampaignId}`
26+
: `${
27+
process.env.REACT_APP_CROWD_WP_URL ?? ''
28+
}/it/dashboard-campagne-funzionali/?cid=${aCampaignId}`;
29+
30+
export const getLocalizedUXDashboardUrl = (
31+
aCampaignId: number,
32+
aLanguage: string
33+
): string =>
34+
aLanguage === 'en'
35+
? `${
36+
process.env.REACT_APP_CROWD_WP_URL ?? ''
37+
}/ux-customer-dashboard/?cid=${aCampaignId}`
38+
: `${
39+
process.env.REACT_APP_CROWD_WP_URL ?? ''
40+
}/it/dashboard-campagne-esperienziali/?cid=${aCampaignId}`;
41+
1842
export function getLocalizeDashboardRoute(props: CampaignActionProps): string {
1943
const { campaignId, cpFamily, outputs } = props;
2044

@@ -26,23 +50,12 @@ export function getLocalizeDashboardRoute(props: CampaignActionProps): string {
2650
currentLang === 'en' ? '' : currentLang
2751
}/campaigns/${campaignId}`;
2852
} else if (cpFamily.toLocaleLowerCase() === 'functional') {
29-
localizedRoute =
30-
currentLang === 'en'
31-
? `${
32-
process.env.REACT_APP_CROWD_WP_URL ?? ''
33-
}/functional-customer-dashboard/?cid=${campaignId}`
34-
: `${
35-
process.env.REACT_APP_CROWD_WP_URL ?? ''
36-
}/it/dashboard-campagne-funzionali/?cid=${campaignId}`;
53+
localizedRoute = getLocalizedFunctionalDashboardUrl(
54+
campaignId,
55+
currentLang
56+
);
3757
} else {
38-
localizedRoute =
39-
currentLang === 'en'
40-
? `${
41-
process.env.REACT_APP_CROWD_WP_URL ?? ''
42-
}/ux-customer-dashboard/?cid=${campaignId}`
43-
: `${
44-
process.env.REACT_APP_CROWD_WP_URL ?? ''
45-
}/it/dashboard-campagne-esperienziali/?cid=${campaignId}`;
58+
localizedRoute = getLocalizedUXDashboardUrl(campaignId, currentLang);
4659
}
4760

4861
// in case of base route ("") we already have a forward slash

‎src/locales/en/translation.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@
2020
"__CAMPAIGN_PAGE_INFO_HEADER_MOBILE": "Mobile",
2121
"__CAMPAIGN_PAGE_INFO_HEADER_TEST_TIMING": "Test duration",
2222
"__CAMPAIGN_PAGE_INFO_HEADER_USERS_NUMBER": "N° Users",
23+
"__CAMPAIGN_GENERATE_REPORT_CARD_BUTTON_LABEL": "Download",
24+
"__CAMPAIGN_GENERATE_REPORT_CARD_META": "Bugs Report",
2325
"__CAMPAIGN_PAGE_REPORTS_CARDS_DOWNLOAD_LABEL": "Download now",
2426
"__CAMPAIGN_PAGE_REPORTS_CARDS_OPEN_LINK_LABEL": "Open link",
2527
"__CAMPAIGN_PAGE_REPORTS_CARDS_UPDATED_ON_LABEL": "Last edit",

‎src/locales/it/translation.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@
2020
"__CAMPAIGN_PAGE_INFO_HEADER_MOBILE": "Mobile",
2121
"__CAMPAIGN_PAGE_INFO_HEADER_TEST_TIMING": "Durata test",
2222
"__CAMPAIGN_PAGE_INFO_HEADER_USERS_NUMBER": "N° Utenti",
23+
"__CAMPAIGN_GENERATE_REPORT_CARD_BUTTON_LABEL": "Scarica",
24+
"__CAMPAIGN_GENERATE_REPORT_CARD_META": "Bugs Report",
2325
"__CAMPAIGN_PAGE_REPORTS_CARDS_DOWNLOAD_LABEL": "Download now",
2426
"__CAMPAIGN_PAGE_REPORTS_CARDS_OPEN_LINK_LABEL": "Open link",
2527
"__CAMPAIGN_PAGE_REPORTS_CARDS_UPDATED_ON_LABEL": "Ultima modifica:",

0 commit comments

Comments
 (0)