Revert "Feat 1031 add theme for n12"

src/App.tsx

@@ -11,7 +11,6 @@ import { useTranslation } from 'react-i18next';
 import { useTheme } from '@material-ui/core/styles';
 import PopUpRedirect from './components/atoms/PopUpRedirect';
 import WidgetsTemplate from './components/organisms/WidgetsTemplate';
-import {observer} from "mobx-react-lite";
 // main components height - must add up to 100
 
 const headerHeight = '5vh';
@@ -71,4 +70,4 @@ const App: FC = () => {
     </StoreContext.Provider>
   );
 };
-export default observer(App);
+export default App;

src/components/atoms/MostSevereAccidentsMarker.tsx

@@ -7,7 +7,7 @@ import { AnyWayButton } from './AnyWayButton';
 import { Typography, MapIcon, TooltipMarker, TooltipArrow } from '.';
 import { ClockPosition } from 'models/ClockPosition';
 import { useTranslation } from 'react-i18next';
-import { silverSmokeColor, defaultBorderRadius } from 'style';
+import { defaultBorderRadius, silverSmokeColor } from 'style';
 import { useLocale } from 'hooks/date.hooks'
 
 interface IProps {

src/components/molecules/GenericBarChart.tsx

@@ -1,9 +1,9 @@
 import React, { FC } from 'react';
 import { ResponsiveContainer, BarChart, LabelList, XAxis, Bar, Tooltip, Legend } from 'recharts';
-import {roseColor, blackColor, ColorScheme, whiteColor} from 'style';
+import { roseColor, honeyColor, yellowColor, blackColor, whiteColor } from 'style';
 import tinycolor from 'tinycolor2';
-import {useTheme} from "@material-ui/core/styles";
 
+const colors = [roseColor, honeyColor, yellowColor];
 const Y_AXIS_OFFSET = 20;
 const MIN_BAR_HEIGHT = 20;
 
@@ -51,7 +51,6 @@ const CustomizedLabel = (props: CustomizedLabelProps) => {
 };
 
 const BarChartContainer: FC<IBarChartBaseProps> = ({ data, textLabel, subtitle, children, isStacked }) => {
-  const theme = useTheme();
   return (
     <>
       <ResponsiveContainer>
@@ -62,7 +61,7 @@ const BarChartContainer: FC<IBarChartBaseProps> = ({ data, textLabel, subtitle,
             dataKey={BAR_CHART_X_LABEL}
             tickLine={false}
             axisLine={false}
-            style={{ fill: (theme.palette.primary as ColorScheme).fontColor }}
+            style={{ fill: blackColor }}
           />
           <Tooltip />
           {isStacked && <Legend verticalAlign="bottom" align="right" iconType="circle" height={5} />}
@@ -90,9 +89,6 @@ const SingleBarChart: FC<ISingleBarChartProps> = ({ data, isPercentage, textLabe
 };
 
 const MultiBarChart: FC<IMultiBarChartProps> = ({ data, isPercentage, isStacked, textLabel, subtitle, editorBarOptions }) => {
-  const theme = useTheme();
-  const colors = (theme.palette.primary as ColorScheme).barChartColors;
-
   const yLabels = data ? Object.keys(data[0]) : [];
   yLabels.splice(0, 1);
   const maxBarsNum = yLabels.length;

src/components/molecules/Header.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useEffect, useState } from 'react';
+import { FC, useCallback, useEffect, useState } from 'react';
 import { observer } from 'mobx-react-lite';
 import { useTranslation } from 'react-i18next';
 import { makeStyles } from '@material-ui/core/styles';
@@ -10,12 +10,11 @@ import RootStore from 'store/root.store';
 import UserProfileHeader from './UserProfileHeader';
 import LanguageMenu from 'components/organisms/LanguageMenu';
 import { FEATURE_FLAGS } from 'utils/env.utils';
+import anywayLogo from 'assets/anyway.png';
 import { SignInIcon } from 'components/atoms/SignInIcon';
 import MapDialog from 'components/molecules/MapDialog';
 import { IPoint } from 'models/Point';
 import { useNavigate } from 'react-router-dom';
-import anywayLogo from 'assets/anyway.png';
-
 
 const useStyles = makeStyles({
   userSection: {

src/components/molecules/NewsFlashComp.tsx

@@ -57,7 +57,7 @@ const NewsFlashComp: FC<IProps> = ({ news }) => {
   const verificationIcon = getVerificationIcon(news.newsflash_location_qualification);
   const criticalIcon = news.critical && <CriticalIcon className={classes.icon} />;
   const {newsId} = useParams()
-  const newsID = newsId ? parseInt(newsId) : ''
+  const newsID = newsId ? parseInt(newsId) : '' 
   const className = news.id === newsID ? classes.activeNewsFlash : '';
   const date = news.date == null ? '' : dateFormat(new Date(news.date.replace(/-/g, '/')), locale);
   const handleLocationEditorOpen = () => setOpen(true);

src/components/molecules/PieChartView.tsx

@@ -1,8 +1,7 @@
 import React, { FC, useCallback } from 'react';
 import { ResponsiveContainer, PieChart, Pie, Cell, PieLabelRenderProps } from 'recharts';
-import {ColorScheme, fontFamilyString, whiteColor} from 'style';
+import { fontFamilyString, pieChartColors, whiteColor } from 'style';
 import { makeStyles } from '@material-ui/core';
-import {useTheme} from "@material-ui/core/styles";
 
 const TEXT_RELATIVE_WIDTH = 0.8;
 
@@ -22,6 +21,7 @@ interface IProps {
   labelProps?: ILabelProps;
 }
 
+const COLORS = pieChartColors;
 const RADIAN = Math.PI / 180;
 const PIE_SHADOW_ID = 'pie-shadow';
 const useStyles = makeStyles({
@@ -142,9 +142,6 @@ export const PieChartView: FC<IProps> = ({
   usePercent,
   labelProps = { customizedLabel: renderCustomizedLabel },
 }) => {
-  const theme = useTheme();
-  const colors = (theme.palette.primary as ColorScheme).pieChartColors;
-
   const renderLabel = useCallback(
     (props: PieLabelRenderProps) =>
       labelProps.customizedLabel(
@@ -179,7 +176,7 @@ export const PieChartView: FC<IProps> = ({
           isAnimationActive={false}
         >
           {data.map((entry: any, index: any) => (
-            <Cell key={index} fill={colors[index % colors.length]} />
+            <Cell key={index} fill={COLORS[index % COLORS.length]} />
           ))}
         </Pie>
       </PieChart>

src/components/molecules/TextView/TextView.tsx

@@ -122,7 +122,7 @@ const TextView: FC<IProps> = ({
       {isSingleType ? (
         <SeverityImage severity={getSingleType(countBySeverity)!} />
       ) : (
-        <Box className={classes.list}>
+        <Box color="text.secondary" className={classes.list}>
           <TextViewList data={countBySeverity} labels={labels} largeNumbers={largeNumbers}/>
         </Box>
       )}

src/components/molecules/card/AnyWayCard.tsx

@@ -1,7 +1,6 @@
 import React, { FC, useState } from 'react';
-import {ColorScheme} from 'style'
 import { Card, CardContent, Box } from '@material-ui/core';
-import {makeStyles} from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import widgetToImage from 'services/to-image.service';
 // TEXT BOX COMPONENT ADD FEATURE
 import  TextBox from 'components/organisms/TextBox'
@@ -22,7 +21,6 @@ import CardEditor from 'components/organisms/CardEditorDialog';
 import { transparent } from 'style';
 import { IDateComments } from 'models/WidgetData';
 import { OrgLogoData } from 'const/cards.const';
-import {observer} from "mobx-react-lite";
 
 const DEFAULTE_SIZE = 1;
 export interface CardSizeOptions {
@@ -50,15 +48,11 @@ const useStyles = makeStyles((theme) => ({
     position: 'relative', // for meta tags
     boxSizing: 'border-box',
     zIndex: 0,
-    backgroundColor: (theme.palette.primary as ColorScheme).backgroundColor,
-    color: (theme.palette.primary as ColorScheme).fontColor,
   },
   content: {
     height: '100%',
     boxSizing: 'border-box',
     padding: 0,
-    backgroundColor: (theme.palette.primary as ColorScheme).containerColor,
-    borderRadius: '16px',
   },
   button: {
     '&:hover': {
@@ -93,6 +87,7 @@ const AnyWayCard: FC<IProps> = ({
   const [element, setElement] = useState({});
   const [isOpen, setOpen] = useState(false);
   const [widgateOpen,SetWidgetOpen] = useState('')
+
   const handleCardEditorOpen = (name:string) => {
     SetWidgetOpen(name)
     setOpen(true)
@@ -199,4 +194,4 @@ const AnyWayCard: FC<IProps> = ({
     </>
   );
 };
-export default observer(AnyWayCard);
+export default AnyWayCard;

src/components/molecules/card/CardHeader.tsx

@@ -5,9 +5,9 @@ import RoadNumberImage from './RoadNumberImage';
 import LamasImage from 'assets/cbs.png';
 import AnywayImage from 'assets/anyway.png';
 import { Typography, Logo } from 'components/atoms';
-import {ColorScheme, opacity80percent, silverSmokeColor} from 'style/';
+import { silverSmokeColor, opacity80percent } from 'style/';
 
-const useStyles = makeStyles((theme) => ({
+const useStyles = makeStyles({
   wrapper: {
     width: '100%',
     height: '100%',
@@ -19,13 +19,6 @@ const useStyles = makeStyles((theme) => ({
     position: 'relative',
     top: '40%',
   },
-  titlesContainer: {
-    backgroundColor: (theme.palette.primary as ColorScheme).titleContainerColor,
-    paddingRight: '25px',
-    paddingLeft: '25px',
-    paddingBottom: '15px',
-    paddingTop: '5px',
-  },
   logosContainer: {
     height: '100%',
   },
@@ -39,7 +32,7 @@ const useStyles = makeStyles((theme) => ({
   label: {
     maxWidth: 'min-content',
   },
-}));
+});
 
 interface IProps {
   variant: HeaderVariant;
@@ -62,7 +55,7 @@ const CardHeader: FC<IProps> = ({ variant, title, subtitle, road,orgIconPath })
           <Box display="flex" justifyContent="center" px={2} className={classes.textWrapper}>
             <Box display="flex" flexDirection="column">
               { variant === HeaderVariant.Centered &&
-                <Box textAlign="center" className={classes.titlesContainer} >
+                <Box textAlign="center">
                   <Typography.Title2 bold>{title}</Typography.Title2>
                   <Typography.Body2>{subtitle}</Typography.Body2>
                 </Box>

src/components/organisms/SideBar.tsx

@@ -62,7 +62,7 @@ const SideBar: FC<IProps> = () => {
         {location && (
           <ErrorBoundary>
             <SideBarMap items={[location]} />
-          </ErrorBoundary>
+          </ErrorBoundary>  
         )}
       </Box>
     </Box>

src/pages/HomePage.tsx

@@ -2,7 +2,7 @@ import { useEffect, FC } from 'react';
 import { Box } from '@material-ui/core';
 import SideBar from 'components/organisms/SideBar';
 import makeStyles from '@material-ui/core/styles/makeStyles';
-import { silverSmokeColor } from 'style';
+import { silverSmokeColor } from '../style';
 import FilterBar from 'components/organisms/FilterBar';
 import OverlayLoader from 'components/molecules/OverlayLoader';
 import { observer } from 'mobx-react-lite';

src/services/news.data.service.ts

@@ -59,24 +59,19 @@ function onErrorFetchNewsFlash() {
 }
 
 export function updateNews(newsId: number, newLocationQualification: any,
-                           streetLocation: IStreetData | null, gpsLocation: IGpsData | null) {
-  const data : Record<string, string | undefined> = {}; // object to hold request data
-  data['newsflash_location_qualification'] = newLocationQualification;
-
+                    streetLocation: IStreetData | null, gpsLocation: IGpsData | null) {
+  const data = [];
+  data.push(`newsflash_location_qualification=${newLocationQualification}`)
   if (gpsLocation) {
-    data['road_segment_name'] = gpsLocation.road_segment_name;
-    data['road1'] = gpsLocation.road1;
+    data.push(`road_segment_name=${gpsLocation.road_segment_name}`)
+    data.push(`road1=${gpsLocation.road1}`)
   } else if (streetLocation) {
-    data['yishuv_name'] = streetLocation.city.yishuv_name;
-    data['street1_hebrew'] = streetLocation.street.street_hebrew;
+    data.push(`yishuv_name=${streetLocation.city.yishuv_name}`)
+    data.push(`street1_hebrew=${streetLocation.street.street_hebrew}`)
   }
-  const url = `${NEWS_FLASH_API}/${newsId}`;
+  const url = `${NEWS_FLASH_API}/${newsId}?${data.join('&')}`;
   axios
-    .patch(url, data, {
-      headers: {
-        'Content-Type': 'application/json',
-      },
-    })
+    .patch(url)
     .then((res) => res.data)
     .catch(onErrorFetchNewsFlash)
 }

src/store/settings.store.ts

@@ -1,15 +1,13 @@
-import {makeAutoObservable, runInAction} from 'mobx';
-import {createMuiTheme, Theme} from '@material-ui/core';
-import {defaultThemeOptions} from 'style';
-import {LANG} from 'const/languages.const';
+import { makeAutoObservable, runInAction } from 'mobx';
+import { Theme, createMuiTheme } from '@material-ui/core';
+import { defaultThemeOptions } from 'style';
+import { LANG } from 'const/languages.const';
 import i18next from 'services/i18n.service';
 import RootStore from './root.store';
-import {ThemeData, ThemeNames, themeOptions} from "style/theme";
 
 export default class SettingsStore {
   rootStore: RootStore;
-  private themeName : ThemeNames = ThemeNames.DEFAULT;
-  _theme : Theme = createMuiTheme(defaultThemeOptions);
+  private _theme: Theme = createMuiTheme(defaultThemeOptions);
   currentLanguageRouteString: string = '';
   selectedLanguage: string = LANG.HE;
 
@@ -19,13 +17,6 @@ export default class SettingsStore {
   }
 
   get theme(): Theme {
-    let new_theme : Theme | undefined = undefined;
-    const organizationName = this.rootStore.userStore.orgNamesList ? this.rootStore.userStore.orgNamesList[0] : '';
-    if (organizationName) {
-      const new_theme_data :  ThemeData | undefined = themeOptions.find((p) => p.key === this.themeName);
-      new_theme = new_theme_data?.theme;
-    }
-    this._theme = new_theme ? new_theme : this._theme;
     return this._theme;
   }