diff --git a/package.json b/package.json index 771e945..7f06f94 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "company-homepage", - "version": "1.1.0", + "version": "1.2.0", "private": true, "license": "(EUPL-1.2)", "homepage": ".", @@ -10,6 +10,7 @@ "gh-pages": "^2.2.0", "mdbreact": "mdbreact-4.25.6.tgz", "node-sass": "^4.13.0", + "react-helmet": "^6.0.0", "react-redux": "^7.1.1", "react-redux-firebase": "^2.4.1", "react-router-dom": "^5.0.1", diff --git a/public/404.html b/public/404.html index 59590ed..fc1fcc6 100644 --- a/public/404.html +++ b/public/404.html @@ -76,12 +76,12 @@ href="%PUBLIC_URL%/fav/favicon-16x16.png" /> - + - + Werbeagentur Christian Aichner - Ihr Partner diff --git a/public/index.html b/public/index.html index a1567b2..cffdaba 100644 --- a/public/index.html +++ b/public/index.html @@ -80,12 +80,12 @@ href="%PUBLIC_URL%/fav/favicon-16x16.png" /> - + - + Werbeagentur Christian Aichner - Ihr Partner diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..6f27bb6 --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: \ No newline at end of file diff --git a/public/sitemap.xml b/public/sitemap.xml new file mode 100644 index 0000000..15d8561 --- /dev/null +++ b/public/sitemap.xml @@ -0,0 +1,27 @@ + + + + https://aichner-christian.com/ + 2020-04-25T19:31:32+00:00 + 1.00 + + + https://aichner-christian.com/location/ + 2020-04-25T19:31:32+00:00 + 0.80 + + + https://aichner-christian.com/branding + 2020-04-25T19:31:32+00:00 + 0.70 + + + https://aichner-christian.com/about + 2020-04-25T19:31:32+00:00 + 0.60 + + \ No newline at end of file diff --git a/src/App.js b/src/App.js index 709d05b..d7d3d7b 100644 --- a/src/App.js +++ b/src/App.js @@ -17,7 +17,7 @@ import Routes from "./Routes"; //> Configuration // Is the homepage ready to launch? -const isLive = false; +const isLive = true; class App extends React.Component { state = { diff --git a/src/Routes.js b/src/Routes.js index 0be368a..5e10881 100644 --- a/src/Routes.js +++ b/src/Routes.js @@ -5,21 +5,16 @@ import React from "react"; import { Route, Switch } from "react-router-dom"; //> Components -/** - * HomePage: A basic template page - */ import { HomePage, MessagePage, - LoginPage, - ProfilePage, PrintingPage, BrandingPage, LocationPage, } from "./components/pages"; //> MessagePage content -const messagePage = ["about", "privacy"]; +const messagePage = ["about", "privacy", "thankyou"]; class Routes extends React.Component { render() { diff --git a/src/components/molecules/Footer/footer.scss b/src/components/molecules/Footer/footer.scss index 1112e06..9906c00 100644 --- a/src/components/molecules/Footer/footer.scss +++ b/src/components/molecules/Footer/footer.scss @@ -16,7 +16,6 @@ // Footer footer { transition: all 0.5s ease; - a { color: #6c757d !important; &:hover { @@ -88,6 +87,7 @@ footer { // Company img svg { width: 80%; + max-width: 200px; } // Dark Mode diff --git a/src/components/molecules/Footer/index.jsx b/src/components/molecules/Footer/index.jsx index 302b0e5..65ab1ce 100644 --- a/src/components/molecules/Footer/index.jsx +++ b/src/components/molecules/Footer/index.jsx @@ -2,7 +2,7 @@ // Contains all the functionality necessary to define React components import React from "react"; // React Router DOM bindings -import { Link } from "react-router-dom"; +import { Link, withRouter } from "react-router-dom"; //> MDB // "Material Design for Bootstrap" is a great UI design framework @@ -15,6 +15,7 @@ import { MDBBtn, MDBSwitch, MDBBadge, + MDBSmoothScroll, } from "mdbreact"; //> Images @@ -58,6 +59,8 @@ class Footer extends React.PureComponent { }; render() { + const { location } = this.props; + return ( @@ -260,7 +263,11 @@ class Footer extends React.PureComponent { Villach-Landskron, Kärnten, AT - +
  • Termin ausmachen @@ -295,9 +302,19 @@ class Footer extends React.PureComponent {

    {this.state.slogan}

    - - Kontakt - + {location.pathname === "/" ? ( + + + Kontakt + + + ) : ( + + + Kontakt + + + )}
    @@ -342,7 +359,7 @@ class Footer extends React.PureComponent { } } -export default Footer; +export default withRouter(Footer); /** * SPDX-License-Identifier: (EUPL-1.2) diff --git a/src/components/molecules/Navbar/index.jsx b/src/components/molecules/Navbar/index.jsx index 149d4b9..8648dcb 100644 --- a/src/components/molecules/Navbar/index.jsx +++ b/src/components/molecules/Navbar/index.jsx @@ -1,7 +1,7 @@ //> React // Contains all the functionality necessary to define React components import React from "react"; -import { withRouter, Link } from "react-router-dom"; +import { withRouter } from "react-router-dom"; //> MDB // "Material Design for Bootstrap" is a great UI design framework @@ -45,19 +45,6 @@ class Navbar extends React.Component { this.state.collapseID === collapseID && this.setState({ collapseID: "" }); }; - // Get navbar mode - getMode = () => { - let opts = {}; - - if (this.props.darkMode) { - opts["dark"] = "dark"; - } else { - opts["light"] = "light"; - } - - return opts; - }; - render() { const overlay = (
    - - Kostenlose Analyse - + {location.pathname === "/" ? ( + + Kostenlose Analyse + + ) : ( + + Kostenlose Analyse + + )} {location.pathname === "/" ? ( diff --git a/src/components/organisms/sections/CallToAction/callToAction.scss b/src/components/organisms/sections/CallToAction/callToAction.scss index b14161e..58cccf2 100644 --- a/src/components/organisms/sections/CallToAction/callToAction.scss +++ b/src/components/organisms/sections/CallToAction/callToAction.scss @@ -2,6 +2,13 @@ // Hide overflow once the animation can exceed the width sometimes overflow: hidden; + // Mobile view moon + .mobile-moon{ + max-height: 100px; + left: 10%; + margin: auto; + } + padding-top: 7.5rem; padding-bottom: 7.5rem; h2 { diff --git a/src/components/organisms/sections/CallToAction/index.jsx b/src/components/organisms/sections/CallToAction/index.jsx index 5a9582b..ce94d2e 100644 --- a/src/components/organisms/sections/CallToAction/index.jsx +++ b/src/components/organisms/sections/CallToAction/index.jsx @@ -2,7 +2,7 @@ // Contains all the functionality necessary to define React components import React from "react"; // React Router DOM bindings -import { Link } from "react-router-dom"; +//import { Link } from "react-router-dom"; //> Additional libraries // Parallax @@ -10,7 +10,15 @@ import { Parallax } from "react-scroll-parallax"; //> MDB // "Material Design for Bootstrap" is a great UI design framework -import { MDBRow, MDBCol, MDBBtn, MDBView, MDBIcon, MDBMask } from "mdbreact"; +import { + MDBRow, + MDBCol, + MDBBtn, + MDBView, + MDBIcon, + MDBMask, + MDBSmoothScroll, +} from "mdbreact"; //> Images // Rocket @@ -25,7 +33,7 @@ class CallToAction extends React.Component { const { darkMode } = this.props; return ( -
    +
    @@ -53,22 +61,26 @@ class CallToAction extends React.Component { Es ist einfach, jetzt zu starten!

    Und der Einstieg und die Erstberatung sind kostenlos.

    - + Jetzt starten - +
    - + - + Moon + + Moon + + diff --git a/src/components/organisms/sections/ContactForm/index.jsx b/src/components/organisms/sections/ContactForm/index.jsx index a8cea3b..fbdd166 100644 --- a/src/components/organisms/sections/ContactForm/index.jsx +++ b/src/components/organisms/sections/ContactForm/index.jsx @@ -2,7 +2,7 @@ // Contains all the functionality necessary to define React components import React from "react"; // Router -import { Link } from "react-router-dom"; +import { Redirect } from "react-router-dom"; //> MDB // "Material Design for Bootstrap" is a great UI design framework @@ -10,7 +10,6 @@ import { MDBRow, MDBCol, MDBBtn, - MDBView, MDBContainer, MDBCard, MDBCardBody, @@ -21,6 +20,12 @@ import { //> Images // To be added +//> Redux +// Connect +import { connect } from "react-redux"; +// Actions +import { createContact } from "../../../../store/actions/contactActions"; + //> CSS import "./contactForm.scss"; @@ -47,22 +52,36 @@ class ContactForm extends React.Component { }); }; + handleSubmit = (e) => { + e.preventDefault(); + + this.props.createContact({ + fullname: this.state.fullname, + email: this.state.email, + phone: this.state.phone, + note: this.state.note, + }); + }; + render() { - const { darkMode } = this.props; + const { darkMode, contact } = this.props; + + // Check if sent and redirect + if (contact.contactSuccess) return ; return (
    - +

    Kontakt aufnehmen

    - Du hast eine Projektidee und bist Dir nicht sicher um deren - Umsetzung? Du benötigst einen Web-Shop, Imagefilm, eine - Website oder eine individuelle Applikation? Zögere nicht und - kontaktiere uns. + Du hast eine Projektidee und bist Dir nicht sicher bezüglich + deren Umsetzung? Du benötigst einen Web-Shop, Imagefilm, + eine Website oder eine individuelle Applikation? Zögere + nicht und kontaktiere uns.

    this.handleSubmit(e)}>
    @@ -74,8 +93,8 @@ class ContactForm extends React.Component { this.onTextChange(e)} @@ -207,7 +226,20 @@ class ContactForm extends React.Component { } } -export default ContactForm; +const mapStateToProps = (state) => { + return { + auth: state.firebase.auth, + contact: state.contact, + }; +}; + +const mapDispatchToProps = (dispatch) => { + return { + createContact: (newContact) => dispatch(createContact(newContact)), + }; +}; + +export default connect(mapStateToProps, mapDispatchToProps)(ContactForm); /** * SPDX-License-Identifier: (EUPL-1.2) diff --git a/src/components/organisms/sections/Hero/hero.scss b/src/components/organisms/sections/Hero/hero.scss index fd8e62a..1b9e476 100644 --- a/src/components/organisms/sections/Hero/hero.scss +++ b/src/components/organisms/sections/Hero/hero.scss @@ -1,56 +1,83 @@ @import "../../../../utilities/variables"; #hero { - // Basic setup - h1 { - font-size: 4.2rem; - } - // Left column text more center - .col-md-6:first-child { - margin-bottom: 6rem !important; - } - .gradient { - background: -moz-linear-gradient( - 45deg, - rgba(42, 27, 161, 0.7), - rgba(29, 210, 177, 0.7) 100% - ); - background: -webkit-linear-gradient( - 45deg, - rgba(42, 27, 161, 0.7), - rgba(29, 210, 177, 0.7) 100% - ); - background: -webkit-gradient( - linear, - 45deg, - from(rgba(42, 27, 161, 0.7)), - to(rgba(29, 210, 177, 0.7)) - ); - background: -o-linear-gradient( - 45deg, - rgba(42, 27, 161, 0.7), - rgba(29, 210, 177, 0.7) 100% - ); - background: linear-gradient( - 45deg, - rgba(42, 27, 161, 0.7), - rgba(29, 210, 177, 0.7) 100% - ); - } - .hero-view { - max-height: 100vh; - } - .container, - #hero .hero-row { - max-height: 100%; + // Mobile view background + .top-mobile-bg { + background-color: darken(white, 10%); + position: relative; + z-index: 1; + &::after { + background: inherit; + top: 0; + margin-top: -20px; + content: ""; + display: block; + height: 50%; + left: 0; + position: absolute; + right: 0; + transform: skewY(-1.5deg); + transform-origin: 100%; + z-index: -1; + } } - h6 { - line-height: 1.7; + // Desktop version + .desktop { + // Basic setup + h1 { + font-size: 4.2rem; + } + // Left column text more center + .col-md-6:first-child { + margin-bottom: 6rem !important; + } + .gradient { + background: -moz-linear-gradient( + 45deg, + rgba(42, 27, 161, 0.7), + rgba(29, 210, 177, 0.7) 100% + ); + background: -webkit-linear-gradient( + 45deg, + rgba(42, 27, 161, 0.7), + rgba(29, 210, 177, 0.7) 100% + ); + background: -webkit-gradient( + linear, + 45deg, + from(rgba(42, 27, 161, 0.7)), + to(rgba(29, 210, 177, 0.7)) + ); + background: -o-linear-gradient( + 45deg, + rgba(42, 27, 161, 0.7), + rgba(29, 210, 177, 0.7) 100% + ); + background: linear-gradient( + 45deg, + rgba(42, 27, 161, 0.7), + rgba(29, 210, 177, 0.7) 100% + ); + } + .hero-view { + max-height: 100vh; + } + .container, + #hero .hero-row { + max-height: 100%; + } + h6 { + line-height: 1.7; + } } // Dark mode &.dark { - background: linear-gradient(to top, $agencyDark 0%, darken($agencyDark, 10%) 100%); + background: linear-gradient( + to top, + $agencyDark 0%, + darken($agencyDark, 10%) 100% + ); color: white; } diff --git a/src/components/organisms/sections/Hero/index.jsx b/src/components/organisms/sections/Hero/index.jsx index d6b32db..170f053 100644 --- a/src/components/organisms/sections/Hero/index.jsx +++ b/src/components/organisms/sections/Hero/index.jsx @@ -1,8 +1,6 @@ //> React // Contains all the functionality necessary to define React components import React from "react"; -// Router -import { Link } from "react-router-dom"; //> Additional // Chart @@ -17,8 +15,7 @@ import { MDBView, MDBContainer, MDBIcon, - MDBCard, - MDBCardBody, + MDBSmoothScroll, } from "mdbreact"; //> Images @@ -90,17 +87,27 @@ class HomePage extends React.Component { return (
    - + - + + + +

    + Deine Vision ist unser Auftrag +

    +
    +
    +

    Deine Vision ist unser Auftrag

    - - Mehr erfahren - - + + + Mehr erfahren + + +
    @@ -108,6 +115,21 @@ class HomePage extends React.Component {
    +
    +

    + Was taugt Deine Online-Präsenz? +

    +

    + Unsere kostenlose Analyse zeigt Dir, welches Potential Deine Online + Präsenz besitzt und was Du davon nutzt. +

    + + + + JETZT herausfinden + + +
    - + JETZT kostenlos herausfinden - + diff --git a/src/components/organisms/sections/Services/index.jsx b/src/components/organisms/sections/Services/index.jsx index 501a923..71411ff 100644 --- a/src/components/organisms/sections/Services/index.jsx +++ b/src/components/organisms/sections/Services/index.jsx @@ -1,12 +1,12 @@ //> React // Contains all the functionality necessary to define React components import React from "react"; -// Router Link -import { Link } from "react-router-dom"; +// Router +//import { Link } from "react-router-dom"; //> MDB // "Material Design for Bootstrap" is a great UI design framework -import { MDBRow, MDBCol, MDBBtn, MDBContainer } from "mdbreact"; +import { MDBRow, MDBCol, MDBContainer } from "mdbreact"; //> CSS import "./services.scss"; diff --git a/src/components/organisms/sections/Services/services.scss b/src/components/organisms/sections/Services/services.scss index 4fefde6..9d7254c 100644 --- a/src/components/organisms/sections/Services/services.scss +++ b/src/components/organisms/sections/Services/services.scss @@ -1,4 +1,6 @@ #services { + // Fix transition + margin-top: -1px; &::before { content: " "; background: linear-gradient(#e6e6e6, white); diff --git a/src/components/organisms/sections/Trusted/index.jsx b/src/components/organisms/sections/Trusted/index.jsx index 7d496f0..223828d 100644 --- a/src/components/organisms/sections/Trusted/index.jsx +++ b/src/components/organisms/sections/Trusted/index.jsx @@ -21,6 +21,20 @@ import snekIMG from "../../../../assets/content/trusted/snek.png"; import psvIMG from "../../../../assets/content/trusted/psv.png"; import e4yIMG from "../../../../assets/content/trusted/e4y.png"; +//> Data +const data = [ + { src: pharmaziegasseIMG, alt: "Pharmaziegasse Logo" }, + { src: snekIMG, alt: "SNEK" }, + { src: gasserPartnerIMG, alt: "Gasser+Partner" }, + { src: kelagbigbandIMG, alt: "KELAG BigBand" }, + { src: e4yIMG, alt: "Emotions 4 You" }, + { src: erlebnishotelIMG, alt: "Erlebnishotel Mölltal" }, + { src: psvIMG, alt: "Polizeisportverein" }, + { src: rauchIMG, alt: "Andreas Rauch" }, + { src: kelagIMG, alt: "KELAG" }, + { src: bluelupiIMG, alt: "Blue Lupi" }, +]; + class Trusted extends React.PureComponent { render() { return ( @@ -34,60 +48,13 @@ class Trusted extends React.PureComponent { zugeschnittene Lösungen in sämtlichen Bereichen des Marketings.

    - - Pharmaziegasse Logo - - - SNEK - - - Gasser+Partner - - - Kelag Big Band Logo - - - Emotions 4 you - - - Erlebnishotel Mölltal Logo - - - Polizeisportverein Villach - - - Andreas Rauch - - - Kelag Logo - - - Blue Lupi Logo - + {data.map((item, i) => { + return ( + + {item.alt} + + ); + })}
    diff --git a/src/components/organisms/sections/Trusted/trusted.scss b/src/components/organisms/sections/Trusted/trusted.scss index b8ff84f..a5e4d70 100644 --- a/src/components/organisms/sections/Trusted/trusted.scss +++ b/src/components/organisms/sections/Trusted/trusted.scss @@ -1,7 +1,7 @@ #trusted { background: #e7e7e7; img { - max-height: 100px; + max-height: 80px; } } diff --git a/src/components/pages/BrandingPage/index.jsx b/src/components/pages/BrandingPage/index.jsx index 94afc00..8b03e0b 100644 --- a/src/components/pages/BrandingPage/index.jsx +++ b/src/components/pages/BrandingPage/index.jsx @@ -2,6 +2,10 @@ // Contains all the functionality necessary to define React components import React from "react"; +//> Additional +// React Helmet +import { Helmet } from "react-helmet"; + //> MDB // "Material Design for Bootstrap" is a great UI design framework import { @@ -26,67 +30,19 @@ import { ReactComponent as Logo } from "../../../assets/content/logo_full.svg"; import weddingsLogo from "../../../assets/content/weddings.png"; class BrandingPage extends React.Component { - componentDidMount = () => { - // Set page title - document.title = "Evolving Our Identity"; - }; - - downloadImage = (type, format) => { - // Preset variable - let options = undefined; - - // Check what URL to get - switch (type) { - case "dark": - switch (format) { - case "svg": - options = { - url: "https://www.aichner-christian.com/public/logo_dark.svg", - }; - break; - case "png": - options = { - url: "https://www.aichner-christian.com/public/logo_dark.png", - }; - break; - default: - break; - } - break; - case "light": - switch (format) { - case "svg": - options = { - url: "https://www.aichner-christian.com/public/logo_white.svg", - }; - break; - case "png": - options = { - url: "https://www.aichner-christian.com/public/logo_white.png", - }; - break; - default: - break; - } - break; - case "wedding": - options = { - url: "https://www.aichner-christian.com/public/logo_wedding.png", - }; - break; - default: - break; - } - - //> Temp output of the file URL - //console.log(options); - }; - render() { const { globalProps } = this.props; return (
    + + Evolving Our Identity + +

    Logos und Verwendung

    diff --git a/src/components/pages/HomePage/index.jsx b/src/components/pages/HomePage/index.jsx index 91db45f..31d493c 100644 --- a/src/components/pages/HomePage/index.jsx +++ b/src/components/pages/HomePage/index.jsx @@ -2,6 +2,10 @@ // Contains all the functionality necessary to define React components import React from "react"; +//> Additional +// React Helmet +import { Helmet } from "react-helmet"; + //> Components // Sections import { @@ -16,16 +20,20 @@ import { // All organisms use their own scss implementation class HomePage extends React.Component { - componentDidMount = () => { - document.title = "Ihr verlässlicher Allround-Partner"; - }; - render() { const { globalProps } = this.props; if (globalProps) { return ( <> + + Werbeagentur Christian Aichner - Ihr Partner + + diff --git a/src/components/pages/LocationPage/index.jsx b/src/components/pages/LocationPage/index.jsx index d916b7b..50eda0e 100644 --- a/src/components/pages/LocationPage/index.jsx +++ b/src/components/pages/LocationPage/index.jsx @@ -2,19 +2,13 @@ // Contains all the functionality necessary to define React components import React from "react"; +//> Additional +// React Helmet +import { Helmet } from "react-helmet"; + //> MDB // "Material Design for Bootstrap" is a great UI design framework -import { - MDBContainer, - MDBRow, - MDBCol, - MDBBtn, - MDBIcon, - MDBPopover, - MDBPopoverHeader, - MDBPopoverBody, - MDBView, -} from "mdbreact"; +import { MDBContainer, MDBRow, MDBCol, MDBBtn, MDBIcon } from "mdbreact"; //> CSS import "./location.scss"; @@ -33,6 +27,14 @@ class LocationPage extends React.Component { render() { return ( + + Wo Du uns findest + +

    Wie Du uns findest

    @@ -102,6 +104,7 @@ class LocationPage extends React.Component { width="450" height="250" frameBorder="0" + title="Location" style={{ Border: 0 }} src={url + `&key=${process.env.REACT_APP_GOOGLE_MAPS}`} allowFullScreen diff --git a/src/components/pages/MessagePage/index.jsx b/src/components/pages/MessagePage/index.jsx index 15ebd12..408722f 100644 --- a/src/components/pages/MessagePage/index.jsx +++ b/src/components/pages/MessagePage/index.jsx @@ -1,6 +1,8 @@ //> React // Contains all the functionality necessary to define React components import React from "react"; +// Router +import { Link } from "react-router-dom"; //> Additional // Copy data to clipboard @@ -8,7 +10,10 @@ import copy from "copy-to-clipboard"; //> MDB // "Material Design for Bootstrap" is a great UI design framework -import { MDBContainer, MDBBtn, MDBAlert, MDBIcon, MDBTooltip } from "mdbreact"; +import { MDBContainer, MDBBtn, MDBIcon, MDBTooltip } from "mdbreact"; + +//> CSS +import "./message.scss"; class MessagePage extends React.Component { state = {}; @@ -135,6 +140,21 @@ class MessagePage extends React.Component {

    )} + {this.props.location.pathname === "/thankyou" && ( +
    +

    + +
    + Danke für Deine Nachricht! +

    +

    Wir melden uns schnellstmöglich möglich bei Dir.

    + + + Zurück zur Hompage + + +
    + )} {this.props.location.pathname === "/privacy" && (

    Datenschutzerklärung

    diff --git a/src/components/pages/MessagePage/message.scss b/src/components/pages/MessagePage/message.scss new file mode 100644 index 0000000..c17ee38 --- /dev/null +++ b/src/components/pages/MessagePage/message.scss @@ -0,0 +1,8 @@ +#message { + margin-top: 4rem !important; +} + +/** + * SPDX-License-Identifier: (EUPL-1.2) + * Copyright © 2019-2020 Werbeagentur Christian Aichner + */ diff --git a/src/components/pages/PrintingPage/index.jsx b/src/components/pages/PrintingPage/index.jsx index adef3f7..5c86f7d 100644 --- a/src/components/pages/PrintingPage/index.jsx +++ b/src/components/pages/PrintingPage/index.jsx @@ -45,11 +45,6 @@ const notusecases = [ ]; class PrintingPage extends React.Component { - componentDidMount = () => { - // Set page title - document.title = "Ihr verlässlicher Allround-Partner"; - }; - render() { const { globalProps } = this.props; diff --git a/src/index.js b/src/index.js index b2ef670..651e548 100644 --- a/src/index.js +++ b/src/index.js @@ -85,9 +85,11 @@ const store = createStore( store.firebaseAuthIsReady.then(() => { // Render the DOM ReactDOM.render( - - - , + + + + + , document.getElementById("root") ); registerServiceWorker(); diff --git a/src/store/actions/contactActions.js b/src/store/actions/contactActions.js new file mode 100644 index 0000000..fd250d8 --- /dev/null +++ b/src/store/actions/contactActions.js @@ -0,0 +1,27 @@ +export const createContact = (newContact) => { + return (dispatch, getState, { getFirestore }) => { + const firestore = getFirestore(); + + // Create contact contact + firestore + .collection("contact") + .doc() + .set({ + ...newContact, + timestamp: new Date().getTime(), + assigned: null, + processed: false, + }) + .then(() => { + dispatch({ type: "CONTACT_SUCCESS" }); + }) + .catch((err) => { + dispatch({ type: "CONTACT_ERROR", err }); + }); + }; +}; + +/** + * SPDX-License-Identifier: (EUPL-1.2) + * Copyright © 2019-2020 Werbeagentur Christian Aichner + */ diff --git a/src/store/reducers/contactReducer.js b/src/store/reducers/contactReducer.js new file mode 100644 index 0000000..3e94efa --- /dev/null +++ b/src/store/reducers/contactReducer.js @@ -0,0 +1,33 @@ +// Have initial state for when state is not ready to be passed +const initState = { + contactError: null, + contactSuccess: null, +}; + +const contactReducer = (state = initState, action) => { + switch (action.type) { + case "CONTACT_SUCCESS": + console.log("Contact created"); + return { + ...state, + contactError: undefined, + contactSuccess: true, + }; + case "CONTACT_ERROR": + console.log("Error creating contact", action.err); + return { + ...state, + contactError: true, + contactSuccess: false, + }; + default: + return state; + } +}; + +export default contactReducer; + +/** + * SPDX-License-Identifier: (EUPL-1.2) + * Copyright © 2019-2020 Werbeagentur Christian Aichner + */ diff --git a/src/store/reducers/rootReducer.js b/src/store/reducers/rootReducer.js index a4bc121..240b4fd 100644 --- a/src/store/reducers/rootReducer.js +++ b/src/store/reducers/rootReducer.js @@ -1,6 +1,8 @@ //> Reducers // Authentication import authReducer from "./authReducer"; +// Contact +import contactReducer from "./contactReducer"; //> Redux import { combineReducers } from "redux"; @@ -13,6 +15,7 @@ import { firebaseReducer } from "react-redux-firebase"; const rootReducer = combineReducers({ auth: authReducer, + contact: contactReducer, firestore: firestoreReducer, firebase: firebaseReducer, // Authentication });