From 0fb00b97c6313cd42dab7a1b8ca9be0cd94d84f2 Mon Sep 17 00:00:00 2001 From: Patrick Fic Date: Fri, 24 Jan 2020 16:35:29 -0800 Subject: [PATCH] Added rates containers + cached language selection --- client/src/App/App.js | 21 ++++++++++++--- .../current-user-dropdown.component.jsx | 5 ++-- .../jobs-list/jobs-list.component.jsx | 19 +++++++++---- .../jobs-rates/jobs-rates.component.jsx | 5 ++++ .../jobs-rates/jobs-rates.container.jsx | 6 +++++ .../langauge-selector.component.jsx | 27 ------------------- client/src/graphql/initial-state.js | 3 ++- client/src/graphql/jobs.queries.js | 4 +-- client/src/graphql/local.queries.js | 22 +++------------ .../pages/jobs-detail/jobs-detail.page.jsx | 3 ++- client/src/pages/jobs/jobs.page.jsx | 6 ++--- 11 files changed, 57 insertions(+), 64 deletions(-) create mode 100644 client/src/components/jobs-rates/jobs-rates.component.jsx create mode 100644 client/src/components/jobs-rates/jobs-rates.container.jsx delete mode 100644 client/src/components/language-selector/langauge-selector.component.jsx diff --git a/client/src/App/App.js b/client/src/App/App.js index 8ff98d835..5ff998489 100644 --- a/client/src/App/App.js +++ b/client/src/App/App.js @@ -2,6 +2,7 @@ import React, { useEffect, Suspense, lazy, useState } from "react"; import { useApolloClient, useQuery } from "@apollo/react-hooks"; import { Switch, Route, Redirect } from "react-router-dom"; import firebase from "../firebase/firebase.utils"; +import i18next from "i18next"; import "./App.css"; @@ -12,7 +13,7 @@ import ErrorBoundary from "../components/error-boundary/error-boundary.component import { auth } from "../firebase/firebase.utils"; import { UPSERT_USER } from "../graphql/user.queries"; -import { GET_CURRENT_USER } from "../graphql/local.queries"; +import { GET_CURRENT_USER, GET_LANGUAGE } from "../graphql/local.queries"; // import { QUERY_BODYSHOP } from "../graphql/bodyshop.queries"; import PrivateRoute from "../utils/private-route"; @@ -89,11 +90,23 @@ export default () => { }; }, [apolloClient]); const HookCurrentUser = useQuery(GET_CURRENT_USER); + const HookLanguage = useQuery(GET_LANGUAGE); if (!loaded) return ; - if (HookCurrentUser.loading) return ; - if (HookCurrentUser.error) - return ; + if (HookCurrentUser.loading || HookLanguage.loading) + return ; + if (HookCurrentUser.error || HookLanguage.error) + return ( + + ); + + if (HookLanguage.data.language) + i18next.changeLanguage(HookLanguage.data.language, (err, t) => { + if (err) + return console.log("Error encountered when changing languages.", err); + }); return (
diff --git a/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx b/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx index 177a1cb97..d2bb617b3 100644 --- a/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx +++ b/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx @@ -1,4 +1,4 @@ -import { useQuery } from "@apollo/react-hooks"; +import { useQuery, useApolloClient } from "@apollo/react-hooks"; import { Avatar, Col, Dropdown, Icon, Menu, Row } from "antd"; import i18next from "i18next"; import React from "react"; @@ -12,13 +12,14 @@ import SignOut from "../sign-out/sign-out.component"; export default function CurrentUserDropdown() { const { t } = useTranslation(); const { loading, error, data } = useQuery(GET_CURRENT_USER); + const client = useApolloClient(); const handleMenuClick = e => { - console.log("e", e); if (e.item.props.actiontype === "lang-select") { i18next.changeLanguage(e.key, (err, t) => { if (err) return console.log("Error encountered when changing languages.", err); + client.writeData({ data: { language: e.key } }); }); } }; diff --git a/client/src/components/jobs-list/jobs-list.component.jsx b/client/src/components/jobs-list/jobs-list.component.jsx index f92279eee..17635845d 100644 --- a/client/src/components/jobs-list/jobs-list.component.jsx +++ b/client/src/components/jobs-list/jobs-list.component.jsx @@ -25,6 +25,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.ro_number"), dataIndex: "ro_number", key: "ro_number", + width: "8%", // onFilter: (value, record) => record.ro_number.includes(value), // filteredValue: state.filteredInfo.text || null, sorter: (a, b) => alphaSort(a, b), @@ -45,6 +46,7 @@ export default withRouter(function JobsList({ key: "owner", ellipsis: true, sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln), + width: "25%", sortOrder: state.sortedInfo.columnKey === "owner" && state.sortedInfo.order, render: (text, record) => { @@ -64,6 +66,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.phone1"), dataIndex: "ownr_ph1", key: "ownr_ph1", + width: "12%", ellipsis: true, render: (text, record) => { return record.ownr_ph1 ? ( @@ -86,6 +89,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.status"), dataIndex: "status", key: "status", + width: "10%", ellipsis: true, sorter: (a, b) => alphaSort(a, b), sortOrder: @@ -99,6 +103,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.vehicle"), dataIndex: "vehicle", key: "vehicle", + width: "15%", ellipsis: true, render: (text, record) => { return record.vehicle ? ( @@ -115,6 +120,7 @@ export default withRouter(function JobsList({ title: t("vehicles.fields.plate_no"), dataIndex: "plate_no", key: "plate_no", + width: "8%", ellipsis: true, sorter: (a, b) => alphaSort(a, b), sortOrder: @@ -131,6 +137,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.clm_no"), dataIndex: "clm_no", key: "clm_no", + width: "12%", ellipsis: true, sorter: (a, b) => alphaSort(a, b), sortOrder: @@ -147,11 +154,12 @@ export default withRouter(function JobsList({ title: t("jobs.fields.clm_total"), dataIndex: "clm_total", key: "clm_total", - sorter: (a, b) => { - return a > b; - }, - sortOrder: - state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order, + width: "8%", + // sorter: (a, b) => { + // return a > b; + // }, + // sortOrder: + // state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order, render: (text, record) => { return record.clm_total ? ( {record.clm_total} @@ -164,6 +172,7 @@ export default withRouter(function JobsList({ title: t("jobs.fields.owner_owing"), dataIndex: "owner_owing", key: "owner_owing", + width: "8%", render: (text, record) => { return record.owner_owing ? ( {record.owner_owing} diff --git a/client/src/components/jobs-rates/jobs-rates.component.jsx b/client/src/components/jobs-rates/jobs-rates.component.jsx new file mode 100644 index 000000000..338a8eb9e --- /dev/null +++ b/client/src/components/jobs-rates/jobs-rates.component.jsx @@ -0,0 +1,5 @@ +import React from "react"; + +export default function JobsRatesComponent() { + return
Jobs Rates Comp
; +} diff --git a/client/src/components/jobs-rates/jobs-rates.container.jsx b/client/src/components/jobs-rates/jobs-rates.container.jsx new file mode 100644 index 000000000..c952d752a --- /dev/null +++ b/client/src/components/jobs-rates/jobs-rates.container.jsx @@ -0,0 +1,6 @@ +import React from "react"; +import JobsRatesComponent from "./jobs-rates.component"; + +export default function JobsRatesContainer() { + return ; +} diff --git a/client/src/components/language-selector/langauge-selector.component.jsx b/client/src/components/language-selector/langauge-selector.component.jsx deleted file mode 100644 index 177c51d4f..000000000 --- a/client/src/components/language-selector/langauge-selector.component.jsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; -import i18next from "i18next"; -import { Dropdown, Menu, Icon } from "antd"; - -export default function LanguageSelector() { - const { t } = useTranslation(); - - const handleMenuClick = e => { - i18next.changeLanguage(e.key, (err, t) => { - if (err) - return console.log("Error encountered when changing languages.", err); - }); - }; - const menu = ( - - {t("general.languages.english")} - {t("general.languages.french")} - {t("general.languages.spanish")} - - ); - return ( - - - - ); -} diff --git a/client/src/graphql/initial-state.js b/client/src/graphql/initial-state.js index 671221c8b..fc69d4836 100644 --- a/client/src/graphql/initial-state.js +++ b/client/src/graphql/initial-state.js @@ -3,5 +3,6 @@ export default { currentUser: null, selectedNavItem: "Home", recentItems: [], - bodyShopData: null + bodyShopData: null, + language: "en_us" }; diff --git a/client/src/graphql/jobs.queries.js b/client/src/graphql/jobs.queries.js index c74240b52..c70285e9b 100644 --- a/client/src/graphql/jobs.queries.js +++ b/client/src/graphql/jobs.queries.js @@ -27,8 +27,8 @@ export const GET_ALL_OPEN_JOBS = gql` } `; -export const SUBSCRIPTION_ALL_OPEN_JOBS = gql` - subscription SUBSCRIPTION_ALL_OPEN_JOBS { +export const QUERY_ALL_OPEN_JOBS = gql` + query QUERY_ALL_OPEN_JOBS { jobs { ownr_fn ownr_ln diff --git a/client/src/graphql/local.queries.js b/client/src/graphql/local.queries.js index 88ae13c4f..7611dfd32 100644 --- a/client/src/graphql/local.queries.js +++ b/client/src/graphql/local.queries.js @@ -1,13 +1,5 @@ import { gql } from "apollo-boost"; -export const SET_CURRENT_USER = gql` - mutation SetCurrentUser($user: User!) { - setCurrentUser(user: $user) @client { - email - } - } -`; - export const GET_CURRENT_USER = gql` query GET_CURRENT_USER { currentUser @client { @@ -26,16 +18,8 @@ export const GET_CURRENT_SELECTED_NAV_ITEM = gql` } `; -export const GET_WHITE_BOARD_LEFT_SIDER_VISIBLE = gql` - { - whiteBoardLeftSiderVisible @client - } -`; - -export const GET_BODYSHOP = gql` - query LOCAL_GET_BODY_SHOP { - bodyShopData @client { - shopname - } +export const GET_LANGUAGE = gql` + query GET_USER_LANGUAGE { + language @client } `; diff --git a/client/src/pages/jobs-detail/jobs-detail.page.jsx b/client/src/pages/jobs-detail/jobs-detail.page.jsx index a87c8f93e..ecc689b03 100644 --- a/client/src/pages/jobs-detail/jobs-detail.page.jsx +++ b/client/src/pages/jobs-detail/jobs-detail.page.jsx @@ -7,6 +7,7 @@ import JobLinesContainer from "../../components/job-lines/job-lines.container.co import JobTombstone from "../../components/job-tombstone/job-tombstone.component"; import JobsDocumentsContainer from "../../components/jobs-documents/jobs-documents.container"; import JobNotesContainer from "../../components/jobs-notes/jobs-notes.container"; +import JobsRatesContainer from "../../components/jobs-rates/jobs-rates.container"; function JobsDetailPage({ jobId, hash, data, match, history }) { const { t } = useTranslation(); @@ -39,7 +40,7 @@ function JobsDetailPage({ jobId, hash, data, match, history }) { } key='#rates'> - Estimate Rates +