8842627401

Committed 26 Apr 2024 03:20AM UTC coverage: 39.836% (-0.4%) from 40.225%

Build # 8842627401

Build Type

push

github

Committed by

web-flow

Commit Message

Ah.more translations (#350)

* legend translations

* working: need to do add sites forms

* more translations

* locations message

* upload image tweaks

Run Details

232 of 876 branches covered (26.48%)

Branch coverage included in aggregate %.

3 of 23 new or added lines in 13 files covered. (13.04%)

16 existing lines in 6 files now uncovered.

1079 of 2415 relevant lines covered (44.68%)

11.21 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/components/mapComponents/mapPageComponents/mobileLandingBar/index.tsx

import React, { PropsWithChildren } from 'react';
import { Routes } from '../../../../App';
import styled from 'styled-components';
import { Typography } from 'antd';
import {
  LIGHT_GREEN,
  LIGHT_GREY,
  MID_GREEN,
  WHITE,
  BLACK,
} from '../../../../utils/colors';
import { Flex } from '../../../themedComponents';
import { LinkButton } from '../../../linkButton';
import { useTranslation } from 'react-i18next';
import { n } from '../../../../utils/stringFormat';
import { site } from '../../../../constants';

const TitleContainer = styled.div`
  display: block;
  width: 100%;
`;

const MobileTitle = styled(Typography.Paragraph)`
  color: ${MID_GREEN};
  font-size: 25px;
  font-weight: bold;
  line-height: 15px;
`;

const MobileParagraph = styled(Typography.Paragraph)`
  font-size: 15px;
`;

const LoginButton = styled(LinkButton)`
  width: 100px;
  height: 50px;
  background: ${WHITE};
  border-color: ${LIGHT_GREY};
  color: ${BLACK};
`;

const SignUpButton = styled(LinkButton)`
  width: 100px;
  height: 50px;
  background-color: ${LIGHT_GREEN};
  border-color: ${LIGHT_GREEN};
`;

const StyledFlex = styled(Flex)`
  margin-bottom: 15px;
`;

interface MobileLandingBarProps {
  readonly barHeader: string;
  readonly barDescription: string | JSX.Element;
  readonly isLoggedIn: boolean;
}

const MobileLandingBar: React.FC<PropsWithChildren<MobileLandingBarProps>> = ({
  barHeader,
  barDescription,
  isLoggedIn,
  children,
}) => {
  const { t } = useTranslation(n(site, 'forms'), { nsMode: 'fallback' });

  return (
    <Flex gap={'0'}>
      <TitleContainer>
        <MobileTitle>{barHeader}</MobileTitle>
        <MobileParagraph>{barDescription}</MobileParagraph>
      </TitleContainer>
      {children}
      {!isLoggedIn && (
        <StyledFlex justifyContent={'center'}>
          <div>
            <LoginButton
              type="primary"
              htmlType="submit"
              size="large"
              to={Routes.LOGIN}
            >
              {t('log_in')}
            </LoginButton>
          </div>
          <div>
            <SignUpButton
              type="primary"
              htmlType="submit"
              size="large"
              to={Routes.SIGNUP}
            >
              {t('sign_up')}
            </SignUpButton>
          </div>
        </StyledFlex>
      )}
    </Flex>
  );
};

export default MobileLandingBar;

1	import React, { PropsWithChildren } from 'react';
2	import { Routes } from '../../../../App';
3	import styled from 'styled-components';
4	import { Typography } from 'antd';
5	import {
6	LIGHT_GREEN,
7	LIGHT_GREY,
8	MID_GREEN,
9	WHITE,
10	BLACK,
11	} from '../../../../utils/colors';
12	import { Flex } from '../../../themedComponents';
13	import { LinkButton } from '../../../linkButton';
14	import { useTranslation } from 'react-i18next';
15	import { n } from '../../../../utils/stringFormat';
16	import { site } from '../../../../constants';
17
18	const TitleContainer = styled.div`	×
19	display: block;
20	width: 100%;
21	`;
22
23	const MobileTitle = styled(Typography.Paragraph)`	×
24	color: ${MID_GREEN};
25	font-size: 25px;
26	font-weight: bold;
27	line-height: 15px;
28	`;
29
30	const MobileParagraph = styled(Typography.Paragraph)`	×
31	font-size: 15px;
32	`;
33
34	const LoginButton = styled(LinkButton)`	×
35	width: 100px;
36	height: 50px;
37	background: ${WHITE};
38	border-color: ${LIGHT_GREY};
39	color: ${BLACK};
40	`;
41
42	const SignUpButton = styled(LinkButton)`	×
43	width: 100px;
44	height: 50px;
45	background-color: ${LIGHT_GREEN};
46	border-color: ${LIGHT_GREEN};
47	`;
48
49	const StyledFlex = styled(Flex)`	×
50	margin-bottom: 15px;
51	`;
52
53	interface MobileLandingBarProps {
54	readonly barHeader: string;
55	readonly barDescription: string \| JSX.Element;
56	readonly isLoggedIn: boolean;
57	}
58
59	const MobileLandingBar: React.FC<PropsWithChildren<MobileLandingBarProps>> = ({	×
60	barHeader,
61	barDescription,
62	isLoggedIn,
63	children,
64	}) => {
NEW 65	const { t } = useTranslation(n(site, 'forms'), { nsMode: 'fallback' });	×
66
UNCOV 67	return (	×
68	<Flex gap={'0'}>
69	<TitleContainer>
70	<MobileTitle>{barHeader}</MobileTitle>
71	<MobileParagraph>{barDescription}</MobileParagraph>
72	</TitleContainer>
73	{children}
74	{!isLoggedIn && (	×
75	<StyledFlex justifyContent={'center'}>
76	<div>
77	<LoginButton
78	type="primary"
79	htmlType="submit"
80	size="large"
81	to={Routes.LOGIN}
82	>
83	{t('log_in')}
84	</LoginButton>
85	</div>
86	<div>
87	<SignUpButton
88	type="primary"
89	htmlType="submit"
90	size="large"
91	to={Routes.SIGNUP}
92	>
93	{t('sign_up')}
94	</SignUpButton>
95	</div>
96	</StyledFlex>
97	)}
98	</Flex>
99	);
100	};
101
102	export default MobileLandingBar;

Code-4-Community / speak-for-the-trees-frontend / 8842627401

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous