chore: resolved mistakes by comments

Author: NikitK-deriv

src/common/components/containers/table.tsx

@@ -1,17 +1,27 @@
 import React from 'react'
 import styled from 'styled-components'
 
-export type StyledProps = {
+export type TermProps = {
     index?: number
     margin?: string
     border_left?: boolean
 }
 
 type TermsServiceType = { header?: string; text: string; icon: string }
 
-type OurServiceType = { first?: TermsServiceType; other?: TermsServiceType[] }
+type OurServiceType = {
+    first?: TermsServiceType
+    other?: TermsServiceType[]
+}
+
+type OurTermsType = {
+    first_column?: TermsServiceType[]
+    second_column?: TermsServiceType[]
+}
 
-type OurTermsType = { first_column?: TermsServiceType[]; second_column?: TermsServiceType[] }
+export type PBType = {
+    our_terms?: OurTermsType
+}
 
 type DataType = {
     data?: {
@@ -41,7 +51,7 @@ const TermText = styled.div`
     text-align: left;
 `
 
-const Term = styled.div<StyledProps>`
+const Term = styled.div<TermProps>`
     display: flex;
     align-items: center;
     width: 170px;

src/common/components/layout/layout.tsx

@@ -3,7 +3,7 @@ import Footer from './footer'
 import Header from './header'
 
 type LayoutType = {
-    children: React.ReactChild
+    children: React.ReactChild | React.ReactChild[]
 }
 
 const Layout = ({ children }: LayoutType) => {

src/images/common/careers/index.ts

@@ -0,0 +1,6 @@
+import Sinbad0 from './sinbad-0.png'
+import Sinbad1 from './sinbad-1.png'
+import Sinbad2 from './sinbad-2.png'
+import Sinbad3 from './sinbad-2.png'
+
+export { Sinbad0, Sinbad1, Sinbad2, Sinbad3 }

src/pages/careers/hiring-process.tsx

@@ -42,7 +42,14 @@ const CardInfo = styled.div`
     flex-direction: column;
 `
 
-const data = [
+type DataType = {
+    number: number
+    icon: string
+    header: string
+    text: string
+}
+
+const data: DataType[] = [
     {
         number: 1,
         icon: Random,

src/pages/careers/index.tsx

@@ -9,13 +9,11 @@ import JoinUs from 'pages/join-us'
 const Careers = () => {
     return (
         <Layout>
-            <>
-                <WorkWithUs />
-                <PerksBenefits />
-                <OpenPositions />
-                <HiringProcess />
-                <JoinUs active={3} />
-            </>
+            <WorkWithUs />
+            <PerksBenefits />
+            <OpenPositions />
+            <HiringProcess />
+            <JoinUs active={3} />
         </Layout>
     )
 }

src/pages/careers/open-positions.tsx

@@ -20,6 +20,10 @@ const HeaderContainer = styled.div`
     padding: 5px 0;
 `
 
+const StyledHeader = styled(Header)`
+    text-transform: uppercase;
+`
+
 const Card = styled(Flex)`
     display: flex;
     justify-content: space-between;
@@ -41,9 +45,16 @@ const CardButton = styled(Link)`
     background-size: 15px 15px;
     background-position: right;
     text-decoration: none;
+    text-transform: uppercase;
 `
+type PositionsType = {
+    icon: string
+    position: string
+    text: string
+    link: string
+}
 
-const positions = [
+const positions: PositionsType[] = [
     {
         icon: Random,
         position: 'Information security',
@@ -86,7 +97,7 @@ const OpenPositions = () => {
     return (
         <OpenPositionsContainer>
             <HeaderContainer>
-                <Header>OPEN POSITIONS</Header>
+                <StyledHeader>OPEN POSITIONS</StyledHeader>
                 <Header font_weight="normal">Make your passon in your career</Header>
             </HeaderContainer>
             <Flex width="1100px" wrap="wrap">

src/pages/careers/perks-benefits.tsx

@@ -3,7 +3,7 @@ import styled from 'styled-components'
 import Random from 'images/svg/random.svg'
 import Sinbad1 from 'images/common/careers/sinbad-1.png'
 import { Text, Header, ImageContainer } from 'common/components/containers'
-import Table from 'common/components/containers/table'
+import Table, { PBType } from 'common/components/containers/table'
 
 const PBContainer = styled.div`
     display: flex;
@@ -32,7 +32,7 @@ const PBTable = styled.div`
     font-weight: bold;
 `
 
-const data = {
+const pb_data: PBType = {
     our_terms: {
         first_column: [
             {
@@ -94,7 +94,7 @@ const PerksBenefits = () => {
             <ImageContainer src={Sinbad1} />
             <PBTable>
                 Our Terms
-                <Table data={data} />
+                <Table data={pb_data} />
             </PBTable>
         </PBContainer>
     )

src/pages/home/welcome.tsx

@@ -7,7 +7,7 @@ import Sinbad1 from 'images/common/carousel/sinbad-1.png'
 import Sinbad2 from 'images/common/carousel/sinbad-2.png'
 import Flex from 'common/components/containers/flex'
 import { Text, Header, ImageContainer } from 'common/components/containers'
-import Table, { StyledProps } from 'common/components/containers/table'
+import Table, { TermProps } from 'common/components/containers/table'
 
 const WelcomeContainer = styled.div`
     width: 100%;
@@ -34,7 +34,7 @@ const CardContainer = styled.div`
     padding-bottom: 25px;
 `
 
-const Card = styled(Flex)<StyledProps>`
+const Card = styled(Flex)<TermProps>`
     max-width: 324px;
     height: 290px;
     padding: 32px 44px 32px 32px;

src/pages/index.tsx

@@ -16,12 +16,10 @@ const Home = () => {
 
     return (
         <Layout>
-            <>
-                <Carousel active={active} setActive={setActive} />
-                <Welcome active={active} />
-                <TechStack />
-                <JoinUs active={active} />
-            </>
+            <Carousel active={active} setActive={setActive} />
+            <Welcome active={active} />
+            <TechStack />
+            <JoinUs active={active} />
         </Layout>
     )
 }

src/pages/join-us.tsx

@@ -1,10 +1,7 @@
 import React from 'react'
 import styled from 'styled-components'
 import { IconProps } from './index'
-import Sinbad0 from 'images/common/carousel/sinbad-0.png'
-import Sinbad1 from 'images/common/carousel/sinbad-1.png'
-import Sinbad2 from 'images/common/carousel/sinbad-2.png'
-import Sinbad3 from 'images/common/careers/sinbad-2.png'
+import { Sinbad0, Sinbad1, Sinbad2, Sinbad3 } from 'images/common/careers'
 import { SeeOurPositions, Header, ImageContainer, Text } from 'common/components/containers'
 import Dashboard from 'images/common/dashboard.png'
 

src/pages/open-positions/index.tsx

@@ -6,10 +6,8 @@ import Layout from 'common/components/layout/layout'
 const Positions = () => {
     return (
         <Layout>
-            <>
-                <OpenPositions />
-                <JoinUs />
-            </>
+            <OpenPositions />
+            <JoinUs />
         </Layout>
     )
 }