Skip to content

Commit

Permalink
Update packages and TopNav [no chat-gpt link due to the error]
Browse files Browse the repository at this point in the history
  • Loading branch information
pbrudny committed Sep 9, 2023
1 parent 31e4fdb commit 645e93e
Show file tree
Hide file tree
Showing 7 changed files with 1,650 additions and 1,393 deletions.
2 changes: 1 addition & 1 deletion .nvmrc
Original file line number Diff line number Diff line change
@@ -1 +1 @@
v14.15.0
v14.21.3
32 changes: 32 additions & 0 deletions config-overrides.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
module.exports = function override(config, env) {
const babelLoaderFilter = rule => {
return rule.loader && rule.loader.includes('babel-loader');
};

// get the babel loader
const babelLoader = config.module.rules.find(babelLoaderFilter);

if (!babelLoader) {
// find the array of rules from oneOf property
const rules = config.module.rules.find(rule => Boolean(rule.oneOf)).oneOf;

// find the babel loader within these rules
const babelRule = rules.find(babelLoaderFilter);

if (babelRule) {
// Modify it to add the decorators plugin
babelRule.options.plugins = [
...babelRule.options.plugins,
["@babel/plugin-proposal-decorators", { "legacy": true }]
];
}
} else {
// Modify the top level loader if it exists
babelLoader.options.plugins = [
...babelLoader.options.plugins,
["@babel/plugin-proposal-decorators", { "legacy": true }]
];
}

return config;
};
17 changes: 11 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -67,11 +67,11 @@
"xml-formatter": "^2.6.1"
},
"scripts": {
"dev": "react-scripts start",
"build": "(node src/sitemap.js) && react-scripts build && (cd server && yarn install)",
"start-client": "react-scripts start",
"dev": "react-app-rewired start",
"build": "(node src/sitemap.js) && react-app-rewired build && (cd server && yarn install)",
"start-client": "react-app-rewired start",
"start": "cd server && yarn start",
"test": "react-scripts test --env=jsdom",
"test": "react-app-rewired test --env=jsdom",
"eject": "react-scripts eject"
},
"cypress-cucumber-preprocessor": {
Expand Down Expand Up @@ -99,11 +99,16 @@
"not op_mini all"
],
"devDependencies": {
"@babel/plugin-proposal-decorators": "^7.22.15",
"@babel/plugin-syntax-jsx": "^7.22.5",
"@babel/preset-react": "^7.22.15",
"babel-loader": "8.1.0",
"compression-webpack-plugin": "^4.0.0",
"enzyme-to-json": "^3.4.4"
"enzyme-to-json": "^3.4.4",
"react-app-rewired": "^2.2.1"
},
"engines": {
"node": "14.15.0",
"node": "14.21.3",
"yarn": ">=1.22.0",
"npm": ">=6.3.14"
}
Expand Down
30 changes: 0 additions & 30 deletions src/common/FilterBar/FilterBar.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import store from "../../stores/store";
import {observer} from "mobx-react";
import FilterButton from "../FilterButton/FilterButton";
import windowSize from 'react-window-size';
import {sliceCity, sliceTech} from "../helpers";
import Heading from '../Heading';
import style from './style.module.scss'
import {ReactComponent as FilterIcon} from '../../assets/img/icons-new-design/filter.svg';
Expand All @@ -26,14 +25,11 @@ import SliderInput from '../SliderInput';
import Button from '../Button/Button';
import {ThemeContext} from "../../themeContext";
import TechnologySlider from "../TechnologySlider/TechnologySlider";

import NumberFormat from "react-number-format";

const marks = [
{value: 0, label: '0'},
{value: 200000, label: '€200k'},
];

class FilterBar extends Component {
constructor(props) {
super(props);
Expand Down Expand Up @@ -71,7 +67,6 @@ class FilterBar extends Component {
this.setState(prevState => {
let filterExperienceSelectedValues = [...prevState.filterExperienceSelectedValues];

// if includes "all"
if (filterExperienceSelectedValues.includes(3)) {
filterExperienceSelectedValues = filterExperienceSelectedValues.filter(elementVal => elementVal != 3);
}
Expand All @@ -83,7 +78,6 @@ class FilterBar extends Component {
filterExperienceSelectedValues.push(value);
return {filterExperienceSelectedValues: filterExperienceSelectedValues};
}

});
};

Expand Down Expand Up @@ -119,11 +113,6 @@ class FilterBar extends Component {
filterExperienceSelectedValues,
filterSortValue
} = this.state;
console.log('Filtering...');
console.log(`Salary: ${filterSalaryRangeValue}`);
console.log(`Exp: ${filterExperienceSelectedValues}`);
console.log(`Sort: ${filterSortValue}`);

[store.salaryBottom, store.salaryTop] = filterSalaryRangeValue;

if (filterExperienceSelectedValues.length > 0) {
Expand All @@ -137,12 +126,10 @@ class FilterBar extends Component {
}

store.sort = filterSortValue;

this.popupClosedHandler();
store.filterJobs();
this.cleanCurrentJob();
}

cleanCurrentJob() {
store.fromUrl = false;
store.currentJobId = null;
Expand Down Expand Up @@ -184,16 +171,6 @@ class FilterBar extends Component {
}

handleTechnology(tech) {
// let citiesLocal = [];
// citiesLocal.push('Cieszyn')
//
// store.cities.push('Gliwice');
// store.cities[0] = 'Siemianowice';


//store1 store.cities, store.technology, store.
// store2 new-cities,

store.remoteLevel = null;
const technology = tech.toLowerCase();

Expand Down Expand Up @@ -242,7 +219,6 @@ class FilterBar extends Component {
if (store.isCitySelected(city.fields.name)) {
return this.props.classes.placeSelected
}

return this.props.classes.place
}

Expand Down Expand Up @@ -330,8 +306,6 @@ class FilterBar extends Component {
const themeContext = this.context;
const {classes} = this.props;
const {cities, technologies, jobs} = store;
const filtersEnd = sliceTech(this.props.windowWidth);
const cityEnd = sliceCity(this.props.windowWidth);

if (!cities || !technologies || !jobs) {
return (
Expand Down Expand Up @@ -585,7 +559,6 @@ class FilterBar extends Component {
</FilterButton>
)
});

const mobileTechnologiesPopupOutput = (
<div
className={themeContext.theme === 'dark' ? [style.filterPopup, style.filterPopup__dark].join(' ') : style.filterPopup}>
Expand Down Expand Up @@ -627,13 +600,11 @@ class FilterBar extends Component {
}

const filterBarClasses = [style.FilterBar];

if (themeContext.theme === 'dark') {
filterBarClasses.push(style.FilterBar_dark);
} else {
filterBarClasses.push(style.FilterBar_light)
}

return (
<>
<div className={filterBarClasses.join(' ')}>
Expand Down Expand Up @@ -717,7 +688,6 @@ class FilterBar extends Component {
}

FilterBar.contextType = ThemeContext;

FilterBar.propTypes = {
classes: PropTypes.object,
};
Expand Down
141 changes: 58 additions & 83 deletions src/common/TopNav/TopNav.js
Original file line number Diff line number Diff line change
@@ -1,20 +1,19 @@
import React from "react";
import {NavLink} from "react-router-dom";
import {ReactComponent as LogoDE} from 'assets/img/logo.svg';
import {observer} from "mobx-react";
import React, { useState, useContext } from "react";
import { NavLink } from "react-router-dom";
import { ReactComponent as LogoDE } from 'assets/img/logo.svg';
import { observer } from "mobx-react";
import style from './style.module.scss';
import Button from '../Button/Button';
import Hamburger from '../Hamburger/Hamburger';
import SideNav from '../SideNav';
import ThemeSwitcher from "../ThemeSwitcher";
import {ThemeContext} from "../../themeContext";
import { ThemeContext } from "../../themeContext";
import MailchimpSubscribe from "react-mailchimp-subscribe";
import {isMobile, isTablet} from "react-device-detect";

import { isMobile } from "react-device-detect";

const url = "https://jobsforit.us21.list-manage.com/subscribe/post?u=9bb02c9224c59d5a48a7cac52&id=9abe4768b0&f_id=00bbc1e1f0";

const CustomForm = ({status, message, onValidated}) => {
const CustomForm = ({ status, message, onValidated }) => {
let email;

const submit = () =>
Expand Down Expand Up @@ -85,47 +84,37 @@ const CustomForm = ({status, message, onValidated}) => {
);
};

// const SubscribeForm = () =>

class TopNav extends React.Component {
const TopNav = observer(() => {
const [showSideNav, setShowSideNav] = useState(false);
const themeContext = useContext(ThemeContext);

state = {
showSideNav: false
const sideNavToggleHandler = () => {
setShowSideNav(prevState => !prevState);
}


sideNavClosedHandler = () => {
this.setState({showSideNav: false});
const sideNavClosedHandler = () => {
setShowSideNav(false);
}

sideNavToggleHandler = () => {
this.setState((prevState) => {
return {showSideNav: !prevState.showSideNav}
});
const classes = [style.topNav];
if (themeContext.theme === 'dark') {
classes.push(style.topNav_dark);
} else {
classes.push(style.topNav_light);
}

render() {
const themeContext = this.context;

const classes = [style.topNav];

if (themeContext.theme === 'dark') {
classes.push(style.topNav_dark);
} else {
classes.push(style.topNav_light);
}
return (
<>
<div className={classes.join(' ')}>
<div className={style.topNav_wrapper}>
<div className={style.topNav_group}>
<a href='/' className={style.topNav_logo}>
<LogoDE />
</a>
</div>

return (
<>
<div className={classes.join(' ')}>
<div className={style.topNav_wrapper}>
{!isMobile && (
<div className={style.topNav_group}>
<a href='/' className={style.topNav_logo}>
<LogoDE/>
</a>
</div>

{ !isMobile && <div className={style.topNav_group}>
<p style={{
marginRight: '1em',
fontSize: "1.5em",
Expand All @@ -135,58 +124,44 @@ class TopNav extends React.Component {
}}>Get latest jobs</p>
<MailchimpSubscribe
url={url}
render={({subscribe, status, message}) => (
render={({ subscribe, status, message }) => (
<CustomForm
status={status}
message={message}
onValidated={formData => subscribe(formData)}
/>
)}
/>
</div>}
<div className={style.topNav_group}>
<ThemeSwitcher/>
<ul className={style.topNav_menu}>
{/*<li className={style.topNav_menu_item}>*/}
{/* <NavLink exact activeClassName={style.topNav_menu_item_activeLink} to={'/'}>Jobs</NavLink>*/}
{/*</li>*/}
{/*<li className={style.topNav_menu_item}>*/}
{/*<NavLink exact activeClassName={style.topNav_menu_item_activeLink} to={'/tutorials'}>DevTube</NavLink>*/}
{/*</li>*/}
<li className={style.topNav_menu_item}>
<NavLink exact activeClassName={style.topNav_menu_item_activeLink}
to={'/pricing'}>Pricing</NavLink>
</li>
<li className={style.topNav_menu_item}>
<NavLink exact activeClassName={style.topNav_menu_item_activeLink}
to={'/statistics'}>Statistics</NavLink>
</li>
{/*<li className={style.topNav_menu_item}>*/}
{/* <NavLink exact activeClassName={style.topNav_menu_item_activeLink} to={'/token'}>Token</NavLink>*/}
{/*</li>*/}
<li className={style.topNav_menu_item}>
{/*<NavLink exact activeClassName={style.topNav_menu_item_activeLink} to={'/brand-room'}>Brand Room</NavLink>*/}
</li>
<li className={style.topNav_menu_item}>
<Button href={'/pricing'} classes={[style.topNav_button]}>Post a Job</Button>
</li>
</ul>
<Hamburger
onClick={this.sideNavToggleHandler}
/>
</div>
)}

<div className={style.topNav_group}>
<ThemeSwitcher />
<ul className={style.topNav_menu}>
<li className={style.topNav_menu_item}>
<NavLink exact activeClassName={style.topNav_menu_item_activeLink}
to={'/pricing'}>Pricing</NavLink>
</li>
<li className={style.topNav_menu_item}>
<NavLink exact activeClassName={style.topNav_menu_item_activeLink}
to={'/statistics'}>Statistics</NavLink>
</li>
<li className={style.topNav_menu_item}>
<Button href={'/pricing'} classes={[style.topNav_button]}>Post a Job</Button>
</li>
</ul>
<Hamburger
onClick={sideNavToggleHandler}
/>
</div>
</div>
<SideNav
open={this.state.showSideNav}
onCloseClick={this.sideNavClosedHandler}
/>
</>
)
}
}

TopNav.contextType = ThemeContext;
</div>
<SideNav
open={showSideNav}
onCloseClick={sideNavClosedHandler}
/>
</>
);
});

TopNav = observer(TopNav);
export default TopNav;
Loading

0 comments on commit 645e93e

Please sign in to comment.