From bdb00cca764301b275611950d203f916a93d35f0 Mon Sep 17 00:00:00 2001 From: Okwuidegbe Emmanuel Date: Apr 05 2021 21:12:36 +0000 Subject: [PATCH 1/7] Landingpage modification --- diff --git a/src/helpers/get_title.js b/src/helpers/get_title.js new file mode 100644 index 0000000..e4f8eb7 --- /dev/null +++ b/src/helpers/get_title.js @@ -0,0 +1,13 @@ +const get_title = (summary) => { + summary = summary.toLowerCase() + if (summary.includes("freeze")) + return "At the milestone freeze, pushes from the updates-testing to the stable repository are suspended until the release candidate is accepted." + if (summary === "rawhide") + return "Next Fedora release hasn't been branched yet from rolling release branch." + if (summary.includes("branch")) + return "Next version of Fedora that was 'branched' from the rolling Rawhide tree and in the future will become the next stable Fedora release." + if (summary.includes("release")) + return "Release candidate was accepted (violating no milestone criteria) and was released." +} + +export default get_title \ No newline at end of file diff --git a/src/index.css b/src/index.css index 27f6835..67506de 100644 --- a/src/index.css +++ b/src/index.css @@ -55,8 +55,16 @@ h1 { } .padded { - padding-top: 0.5em; - + padding-top: 0.5em; +} + +.padded-anchor { + color: #17202A; +} + +.padded-anchor:hover { + color: #1F618D; + text-decoration: none; } .timeline { diff --git a/src/landingpage/BetaStat.js b/src/landingpage/BetaStat.js new file mode 100644 index 0000000..5204f6b --- /dev/null +++ b/src/landingpage/BetaStat.js @@ -0,0 +1,33 @@ +import React from "react" + +const BetaStat = ({data}) => ( + + + + + + + + + + + + + + + + + + + + + + + + +
+ Beta +
Proposed Blockers{data.beta_blockers_proposed}
Accepted Blockers{data.beta_blockers}
Proposed FEs{data.beta_fe_proposed}
Accepted FEs{data.beta_fe}
+) + +export default BetaStat diff --git a/src/landingpage/Blockers.js b/src/landingpage/Blockers.js index 30b923a..d45dc38 100644 --- a/src/landingpage/Blockers.js +++ b/src/landingpage/Blockers.js @@ -1,85 +1,33 @@ -import React, { Component } from "react" +import React from "react" import { Row } from "reactstrap" import SourceLink from "./SourceLink" +import FinalStat from "./FinalStat" +import BetaStat from "./BetaStat" -class Blockers extends Component { - constructor(props) { - super(props) - this.state = { blockerbugs: {}, release: 0 } - } - - render() { - if (this.props.data) - return ( -
-

- Fedora {this.props.release} blockers and FEs{" "} - -

- -
- - - - - - - - - - - - - - - - - - - - - - - - -
- Beta -
Proposed Blockers{this.props.data.beta_blockers_proposed}
Accepted Blockers{this.props.data.beta_blockers}
Proposed FEs{this.props.data.beta_fe_proposed}
Accepted FEs{this.props.data.beta_fe}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - -
- Final -
Proposed Blockers{this.props.data.final_blockers_proposed}
Accepted Blockers{this.props.data.final_blockers}
Proposed FEs{this.props.data.final_fe_proposed}
Accepted FEs{this.props.data.final_fe}
-
- -
- ) - } +const Blockers = ({data, release}) => { + if (data) + return ( +
+

+ + Fedora {release} blockers and FEs{" "} + + +

+ +
+ +
+
+ +
+ +
+ ) } -export default Blockers +export default Blockers \ No newline at end of file diff --git a/src/landingpage/Dates.js b/src/landingpage/Dates.js new file mode 100644 index 0000000..4d8d7ed --- /dev/null +++ b/src/landingpage/Dates.js @@ -0,0 +1,13 @@ +import React from "react" + +const Dates = ({data}) => { + return data.map((milestone) => { + return ( + + {milestone.date} + + ) + }) +} + +export default Dates \ No newline at end of file diff --git a/src/landingpage/Event.js b/src/landingpage/Event.js new file mode 100644 index 0000000..4408d5b --- /dev/null +++ b/src/landingpage/Event.js @@ -0,0 +1,14 @@ +import React from "react" + +const Event = ({start, summary, link}) => ( +
  • + {start} +
    + + {summary} + +
    +
    • +) + +export default Event \ No newline at end of file diff --git a/src/landingpage/Events.js b/src/landingpage/Events.js index 54eb80b..a236cc7 100644 --- a/src/landingpage/Events.js +++ b/src/landingpage/Events.js @@ -1,58 +1,23 @@ -import React, { Component } from "react" -import dateFormat from "dateformat" +import React from "react" import SourceLink from './SourceLink' +import Meetings from "./Meetings" -class Events extends Component { - constructor(props) { - super(props) - this.state = { meetings: [] } - } - - render() { - const meetings = this.props.data.map((meeting) => { - const old = new Date(meeting.start) - var meeting_start = dateFormat( - new Date(old.getTime() - old.getTimezoneOffset() * 60000), - "d mmm yyyy - HH:MM" - ) - if (meeting.fullday) { - meeting_start = meeting_start.slice(0, -5) + "All day" - } - return ( - - ) - }) - return ( -
    -

    - Meetings and testdays in the next 7 days{" "} - -

    -
      {meetings}
    -
    - ) - } -} - -class Event extends Component { - render() { - return ( -
  • - {this.props.start} -
    - - {this.props.summary} - -
    -
    • - ) - } -} +const Events = ({data}) => ( +
    +

    + + Meetings and testdays in the next 7 days{" "} + + +

    +
      + +
    +
    +) export default Events diff --git a/src/landingpage/FinalStat.js b/src/landingpage/FinalStat.js new file mode 100644 index 0000000..c372b51 --- /dev/null +++ b/src/landingpage/FinalStat.js @@ -0,0 +1,33 @@ +import React from "react" + +const FinalStat = ({data}) => ( + + + + + + + + + + + + + + + + + + + + + + + + +
    + Final +
    Proposed Blockers{data.final_blockers_proposed}
    Accepted Blockers{data.final_blockers}
    Proposed FEs{data.final_fe_proposed}
    Accepted FEs{data.final_fe}
    +) + +export default FinalStat \ No newline at end of file diff --git a/src/landingpage/LandingPage.js b/src/landingpage/LandingPage.js index b1bee82..360f5a6 100644 --- a/src/landingpage/LandingPage.js +++ b/src/landingpage/LandingPage.js @@ -74,10 +74,11 @@ class LandingPage extends Component { this.state.config_mode ? this.available_components : this.state.enabled_components, 2 ) + components = components.map((row) => ( - + {row.map((item) => ( -
    +
    )) + return (
    diff --git a/src/landingpage/Line.js b/src/landingpage/Line.js new file mode 100644 index 0000000..932366a --- /dev/null +++ b/src/landingpage/Line.js @@ -0,0 +1,16 @@ +import React from "react" + +const Line = ({color}) => { + const lineStyle = { + stroke: color, + strokeWidth: "3", + } + return ( + + + + + ) +} + +export default Line \ No newline at end of file diff --git a/src/landingpage/Lines.js b/src/landingpage/Lines.js new file mode 100644 index 0000000..62db822 --- /dev/null +++ b/src/landingpage/Lines.js @@ -0,0 +1,14 @@ +import React from "react" +import Line from "./Line" + +const Lines = ({data}) => { + return data.map((milestone) => { + return ( + + + + ) + }) +} + +export default Lines \ No newline at end of file diff --git a/src/landingpage/Meetings.js b/src/landingpage/Meetings.js new file mode 100644 index 0000000..e9454ce --- /dev/null +++ b/src/landingpage/Meetings.js @@ -0,0 +1,28 @@ +import React from "react" +import dateFormat from "dateformat" +import Event from "./Event" + + +const Meetings = ({data}) => { + return data.map((meeting) => { + const old = new Date(meeting.start) + var meeting_start = dateFormat( + new Date(old.getTime() - old.getTimezoneOffset() * 60000), + "d mmm yyyy - HH:MM" + ) + if (meeting.fullday) { + meeting_start = meeting_start.slice(0, -5) + "All day" + } + return ( + + ) + }) +} + +export default Meetings \ No newline at end of file diff --git a/src/landingpage/Minutes.js b/src/landingpage/Minutes.js index 4f88f2b..80b3012 100644 --- a/src/landingpage/Minutes.js +++ b/src/landingpage/Minutes.js @@ -1,28 +1,24 @@ -import React, { Component } from "react" +import React from "react" -class Events extends Component { - render() { - return ( -
    -

    Fedora QA Meeting Minutes

    -
    - - Latest minutes from {this.props.data.date} - -
    - Visit{" "} - - meetbot - {" "} - to see older. -
    -
    -
    - ) - } -} +const Minutes = ({data}) => ( +
    +

    Fedora QA Meeting Minutes

    +
    + + Latest minutes from {data.date} + +
    + Visit{" "} + + meetbot + {" "} + to see older. +
    +
    +
    +) -export default Events +export default Minutes diff --git a/src/landingpage/Schedule.js b/src/landingpage/Schedule.js new file mode 100644 index 0000000..0d5a562 --- /dev/null +++ b/src/landingpage/Schedule.js @@ -0,0 +1,17 @@ +import React from "react" +import get_title from "../helpers/get_title" + +const Schedule = ({data}) => { + return data.map((milestone) => { + return ( + + {milestone.summary} + + ) + }) +} + +export default Schedule \ No newline at end of file diff --git a/src/landingpage/SourceLink.js b/src/landingpage/SourceLink.js index 76cfa0b..6e370e9 100644 --- a/src/landingpage/SourceLink.js +++ b/src/landingpage/SourceLink.js @@ -1,17 +1,13 @@ -import React, {Component} from 'react' +import React from 'react' -class SourceLink extends Component { - render() { - return ( - - - - ) - } -} +const SourceLink = ({href}) => ( + + + +) export default SourceLink diff --git a/src/landingpage/Timeline.js b/src/landingpage/Timeline.js index 1de10c5..b0c7c01 100644 --- a/src/landingpage/Timeline.js +++ b/src/landingpage/Timeline.js @@ -1,84 +1,30 @@ -import React, { Component } from "react" +import React from "react" import SourceLink from './SourceLink' +import Dates from "./Dates" +import Lines from "./Lines" +import Schedule from "./Schedule" -class Timeline extends Component { - constructor(props) { - super(props) - this.state = { schedule: [] } - } - - get_title(summary) { - summary = summary.toLowerCase() - if (summary.includes("freeze")) - return "At the milestone freeze, pushes from the updates-testing to the stable repository are suspended until the release candidate is accepted." - if (summary === "rawhide") - return "Next Fedora release hasn't been branched yet from rolling release branch." - if (summary.includes("branch")) - return "Next version of Fedora that was 'branched' from the rolling Rawhide tree and in the future will become the next stable Fedora release." - if (summary.includes("release")) - return "Release candidate was accepted (violating no milestone criteria) and was released." - } - - render() { - const line = this.props.data.map((milestone) => { - return ( - - - - ) - }) - - const dates = this.props.data.map((milestone) => { - return ( - - {milestone.date} - - ) - }) - - const schedule = this.props.data.map((milestone) => { - return ( - - {milestone.summary} - - ) - }) - return ( -
    -

    - Current development schedule{" "} - -

    -
    - - - {line} - {dates} - {schedule} - -
    -
    -
    - ) - } -} - -class Line extends Component { - render() { - const lineStyle = { - stroke: this.props.color, - strokeWidth: "3", - } - return ( - - - - - ) - } -} - +const Timeline = ({data}) => ( +
    +

    + + Current development schedule{" "} + + +

    +
    + + + + + + +
    +
    +
    +) export default Timeline From 7f307496c0e3a3cd86e12671c9f23f5c9035b92e Mon Sep 17 00:00:00 2001 From: Okwuidegbe Emmanuel Date: Apr 08 2021 15:09:01 +0000 Subject: [PATCH 2/7] Landingpage modification --- diff --git a/src/helpers/get_title.js b/src/helpers/get_title.js new file mode 100644 index 0000000..e4f8eb7 --- /dev/null +++ b/src/helpers/get_title.js @@ -0,0 +1,13 @@ +const get_title = (summary) => { + summary = summary.toLowerCase() + if (summary.includes("freeze")) + return "At the milestone freeze, pushes from the updates-testing to the stable repository are suspended until the release candidate is accepted." + if (summary === "rawhide") + return "Next Fedora release hasn't been branched yet from rolling release branch." + if (summary.includes("branch")) + return "Next version of Fedora that was 'branched' from the rolling Rawhide tree and in the future will become the next stable Fedora release." + if (summary.includes("release")) + return "Release candidate was accepted (violating no milestone criteria) and was released." +} + +export default get_title \ No newline at end of file diff --git a/src/index.css b/src/index.css index 27f6835..67506de 100644 --- a/src/index.css +++ b/src/index.css @@ -55,8 +55,16 @@ h1 { } .padded { - padding-top: 0.5em; - + padding-top: 0.5em; +} + +.padded-anchor { + color: #17202A; +} + +.padded-anchor:hover { + color: #1F618D; + text-decoration: none; } .timeline { diff --git a/src/landingpage/Blockers.js b/src/landingpage/Blockers.js index 30b923a..7b0ca1b 100644 --- a/src/landingpage/Blockers.js +++ b/src/landingpage/Blockers.js @@ -1,85 +1,24 @@ -import React, { Component } from "react" -import { Row } from "reactstrap" +import React from "react" import SourceLink from "./SourceLink" +import Stats from "./Stats" -class Blockers extends Component { - constructor(props) { - super(props) - this.state = { blockerbugs: {}, release: 0 } - } - - render() { - if (this.props.data) - return ( -
    -

    - Fedora {this.props.release} blockers and FEs{" "} - -

    - -
    - - - - - - - - - - - - - - - - - - - - - - - - -
    - Beta -
    Proposed Blockers{this.props.data.beta_blockers_proposed}
    Accepted Blockers{this.props.data.beta_blockers}
    Proposed FEs{this.props.data.beta_fe_proposed}
    Accepted FEs{this.props.data.beta_fe}
    -
    - -
    - - - - - - - - - - - - - - - - - - - - - - - - -
    - Final -
    Proposed Blockers{this.props.data.final_blockers_proposed}
    Accepted Blockers{this.props.data.final_blockers}
    Proposed FEs{this.props.data.final_fe_proposed}
    Accepted FEs{this.props.data.final_fe}
    -
    -     -
    - ) - } +const Blockers = ({data, release}) => { + if (data) + return ( + + ) } -export default Blockers +export default Blockers \ No newline at end of file diff --git a/src/landingpage/Dates.js b/src/landingpage/Dates.js new file mode 100644 index 0000000..4d8d7ed --- /dev/null +++ b/src/landingpage/Dates.js @@ -0,0 +1,13 @@ +import React from "react" + +const Dates = ({data}) => { + return data.map((milestone) => { + return ( + + {milestone.date} + + ) + }) +} + +export default Dates \ No newline at end of file diff --git a/src/landingpage/Event.js b/src/landingpage/Event.js new file mode 100644 index 0000000..4408d5b --- /dev/null +++ b/src/landingpage/Event.js @@ -0,0 +1,14 @@ +import React from "react" + +const Event = ({start, summary, link}) => ( +
  • + {start} +
    + + {summary} + +
    +
    • +) + +export default Event \ No newline at end of file diff --git a/src/landingpage/Events.js b/src/landingpage/Events.js index 54eb80b..a236cc7 100644 --- a/src/landingpage/Events.js +++ b/src/landingpage/Events.js @@ -1,58 +1,23 @@ -import React, { Component } from "react" -import dateFormat from "dateformat" +import React from "react" import SourceLink from './SourceLink' +import Meetings from "./Meetings" -class Events extends Component { - constructor(props) { - super(props) - this.state = { meetings: [] } - } - - render() { - const meetings = this.props.data.map((meeting) => { - const old = new Date(meeting.start) - var meeting_start = dateFormat( - new Date(old.getTime() - old.getTimezoneOffset() * 60000), - "d mmm yyyy - HH:MM" - ) - if (meeting.fullday) { - meeting_start = meeting_start.slice(0, -5) + "All day" - } - return ( - - ) - }) - return ( -
    -

    - Meetings and testdays in the next 7 days{" "} - -

    -
      {meetings}
    -
    - ) - } -} - -class Event extends Component { - render() { - return ( -
  • - {this.props.start} -
    - - {this.props.summary} - -
    -
    • - ) - } -} +const Events = ({data}) => ( + +) export default Events diff --git a/src/landingpage/LandingPage.js b/src/landingpage/LandingPage.js index b1bee82..360f5a6 100644 --- a/src/landingpage/LandingPage.js +++ b/src/landingpage/LandingPage.js @@ -74,10 +74,11 @@ class LandingPage extends Component { this.state.config_mode ? this.available_components : this.state.enabled_components, 2 ) + components = components.map((row) => ( - + {row.map((item) => ( -
    +
    )) + return (
    diff --git a/src/landingpage/Line.js b/src/landingpage/Line.js new file mode 100644 index 0000000..932366a --- /dev/null +++ b/src/landingpage/Line.js @@ -0,0 +1,16 @@ +import React from "react" + +const Line = ({color}) => { + const lineStyle = { + stroke: color, + strokeWidth: "3", + } + return ( + + + + + ) +} + +export default Line \ No newline at end of file diff --git a/src/landingpage/Lines.js b/src/landingpage/Lines.js new file mode 100644 index 0000000..62db822 --- /dev/null +++ b/src/landingpage/Lines.js @@ -0,0 +1,14 @@ +import React from "react" +import Line from "./Line" + +const Lines = ({data}) => { + return data.map((milestone) => { + return ( + + + + ) + }) +} + +export default Lines \ No newline at end of file diff --git a/src/landingpage/Meetings.js b/src/landingpage/Meetings.js new file mode 100644 index 0000000..e9454ce --- /dev/null +++ b/src/landingpage/Meetings.js @@ -0,0 +1,28 @@ +import React from "react" +import dateFormat from "dateformat" +import Event from "./Event" + + +const Meetings = ({data}) => { + return data.map((meeting) => { + const old = new Date(meeting.start) + var meeting_start = dateFormat( + new Date(old.getTime() - old.getTimezoneOffset() * 60000), + "d mmm yyyy - HH:MM" + ) + if (meeting.fullday) { + meeting_start = meeting_start.slice(0, -5) + "All day" + } + return ( + + ) + }) +} + +export default Meetings \ No newline at end of file diff --git a/src/landingpage/Minutes.js b/src/landingpage/Minutes.js index 4f88f2b..80b3012 100644 --- a/src/landingpage/Minutes.js +++ b/src/landingpage/Minutes.js @@ -1,28 +1,24 @@ -import React, { Component } from "react" +import React from "react" -class Events extends Component { - render() { - return ( -
    -

    Fedora QA Meeting Minutes

    -
    - - Latest minutes from {this.props.data.date} - -
    - Visit{" "} - - meetbot - {" "} - to see older. -
    -
    -
    - ) - } -} +const Minutes = ({data}) => ( +
    +

    Fedora QA Meeting Minutes

    +
    + + Latest minutes from {data.date} + +
    + Visit{" "} + + meetbot + {" "} + to see older. +
    +
    +
    +) -export default Events +export default Minutes diff --git a/src/landingpage/Schedule.js b/src/landingpage/Schedule.js new file mode 100644 index 0000000..0d5a562 --- /dev/null +++ b/src/landingpage/Schedule.js @@ -0,0 +1,17 @@ +import React from "react" +import get_title from "../helpers/get_title" + +const Schedule = ({data}) => { + return data.map((milestone) => { + return ( + + {milestone.summary} + + ) + }) +} + +export default Schedule \ No newline at end of file diff --git a/src/landingpage/SourceLink.js b/src/landingpage/SourceLink.js index 76cfa0b..6e370e9 100644 --- a/src/landingpage/SourceLink.js +++ b/src/landingpage/SourceLink.js @@ -1,17 +1,13 @@ -import React, {Component} from 'react' +import React from 'react' -class SourceLink extends Component { - render() { - return ( - - - - ) - } -} +const SourceLink = ({href}) => ( + + + +) export default SourceLink diff --git a/src/landingpage/Stats.js b/src/landingpage/Stats.js new file mode 100644 index 0000000..e2d9b26 --- /dev/null +++ b/src/landingpage/Stats.js @@ -0,0 +1,67 @@ +import React from "react" +import { Row } from "reactstrap" + +const Stats = ({data}) => ( + +
    + + + + + + + + + + + + + + + + + + + + + + + + +
    + Beta +
    Proposed Blockers{data.beta_blockers_proposed}
    Accepted Blockers{data.beta_blockers}
    Proposed FEs{data.beta_fe_proposed}
    Accepted FEs{data.beta_fe}
    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + +
    + Final +
    Proposed Blockers{data.final_blockers_proposed}
    Accepted Blockers{data.final_blockers}
    Proposed FEs{data.final_fe_proposed}
    Accepted FEs{data.final_fe}
    +
    +     +) + +export default Stats \ No newline at end of file diff --git a/src/landingpage/Timeline.js b/src/landingpage/Timeline.js index 1de10c5..b0c7c01 100644 --- a/src/landingpage/Timeline.js +++ b/src/landingpage/Timeline.js @@ -1,84 +1,30 @@ -import React, { Component } from "react" +import React from "react" import SourceLink from './SourceLink' +import Dates from "./Dates" +import Lines from "./Lines" +import Schedule from "./Schedule" -class Timeline extends Component { - constructor(props) { - super(props) - this.state = { schedule: [] } - } - - get_title(summary) { - summary = summary.toLowerCase() - if (summary.includes("freeze")) - return "At the milestone freeze, pushes from the updates-testing to the stable repository are suspended until the release candidate is accepted." - if (summary === "rawhide") - return "Next Fedora release hasn't been branched yet from rolling release branch." - if (summary.includes("branch")) - return "Next version of Fedora that was 'branched' from the rolling Rawhide tree and in the future will become the next stable Fedora release." - if (summary.includes("release")) - return "Release candidate was accepted (violating no milestone criteria) and was released." - } - - render() { - const line = this.props.data.map((milestone) => { - return ( - - - - ) - }) - - const dates = this.props.data.map((milestone) => { - return ( - - {milestone.date} - - ) - }) - - const schedule = this.props.data.map((milestone) => { - return ( - - {milestone.summary} - - ) - }) - return ( -
    -

    - Current development schedule{" "} - -

    -
    - - - {line} - {dates} - {schedule} - -
    -
    -
    - ) - } -} - -class Line extends Component { - render() { - const lineStyle = { - stroke: this.props.color, - strokeWidth: "3", - } - return ( - - - - - ) - } -} - +const Timeline = ({data}) => ( +
    +

    + + Current development schedule{" "} + + +

    +
    + + + + + + +
    +
    +
    +) export default Timeline From aa64667cb8f62025deb09e078dbabe4dcc5396e3 Mon Sep 17 00:00:00 2001 From: Okwuidegbe Emmanuel Date: Apr 21 2021 01:53:46 +0000 Subject: [PATCH 4/7] Refractor code and add @reduxtoolkit --- diff --git a/package.json b/package.json index 20d0779..5605af9 100644 --- a/package.json +++ b/package.json @@ -4,14 +4,15 @@ "private": true, "homepage": ".", "dependencies": { + "@reduxjs/toolkit": "^1.5.1", "bootstrap": "^4.4.1", "dateformat": "^3.0.3", - "react": "^16.5.2", - "react-dom": "^16.5.2", + "react": "^17.0.2", + "react-dom": "^17.0.2", "react-redux": "^7.2.1", - "react-router-dom": "^4.3.1", + "react-router-dom": "^5.2.0", "react-scripts": "^3.3.0", - "reactstrap": "^6.5.0", + "reactstrap": "^8.9.0", "redux": "^4.0.5", "redux-logger": "^3.0.6", "redux-thunk": "^2.3.0", diff --git a/src/App.js b/src/App.js index b782aa0..0b36658 100644 --- a/src/App.js +++ b/src/App.js @@ -1,28 +1,21 @@ -import React, { Component } from 'react'; - +import React from 'react'; import { Route, Switch } from 'react-router'; import { BrowserRouter } from 'react-router-dom' - import Wizard from './wizard/Wizard'; import LandingPage from './landingpage/LandingPage'; import NotFound from './NotFound'; - -class App extends Component { - render() { - return ( - -
    - - - - - - -
    -     - ); - } -} +const App = () => ( + +
    + + + + + + +
    +     +) export default App; diff --git a/src/actions/reduxActions.js b/src/actions/reduxActions.js deleted file mode 100644 index 80a3461..0000000 --- a/src/actions/reduxActions.js +++ /dev/null @@ -1,43 +0,0 @@ -import ActionTypes from '../constants'; - -export const loadDataResp = payload => ({ - type: ActionTypes.LOAD_DATA_RESP, - payload: payload -}) - -export const loadData = payload => dispatch => { - dispatch({ - type: ActionTypes.LOAD_DATA, - payload: payload - }); - - fetch(window.env.ORACULUM_API_URL_v1 + "landing_page") - .then(blob => blob.json()) - .then(data => { - dispatch(loadDataResp(data)) - }) - .catch((error) => { - console.error('Error:', error); - }); -} - -export const loadWizardDataResp = payload => ({ - type: ActionTypes.LOAD_WIZARD_DATA_RESP, - payload: payload -}) - -export const loadWizardData = payload => dispatch => { - dispatch({ - type: ActionTypes.LOAD_WIZARD_DATA, - payload: payload - }); - - fetch(window.env.ORACULUM_API_URL_v1 + "actions/all") - .then(blob => blob.json()) - .then(data => { - dispatch(loadWizardDataResp(data)) - }) - .catch((error) => { - console.error('Error:', error); - }); -} diff --git a/src/app/redux-slice/landingpage.js b/src/app/redux-slice/landingpage.js new file mode 100644 index 0000000..2004116 --- /dev/null +++ b/src/app/redux-slice/landingpage.js @@ -0,0 +1,46 @@ +import { createAsyncThunk, createSlice, createSelector } from '@reduxjs/toolkit'; +import { oraculumApiUrl_v1 } from "../../config" + +const initialState = { + landingpage: { + blockerbugs: {}, + devel: 0, + meetings: [], + schedule: [], + last_qa_meeting: {}, + stable: 0, + config_mode: false, + enabled_components: ["events", "blockers", "minutes"], + }, +} + +export const fetchLandingpageData = createAsyncThunk('landingpage/fetchLandingData', async () => { + const response = await fetch(`${oraculumApiUrl_v1}landing_page`) + const data = await response.json() + return data +}) + + +const landingpageSlice = createSlice({ + name: 'landingpage', + initialState, + reducers: { + responseData: (state, action) => { + state.landingpage = action.payload + } + }, + extraReducers: { + [fetchLandingpageData.fulfilled]: (state, action) => { + state.landingpage = action.payload + }, + } +}); + +export const { responseData } = landingpageSlice.actions; + +export const selectLandingpageData = createSelector( + (state) => state.landingpage.landingpage, + (state) => state +) + +export default landingpageSlice.reducer diff --git a/src/app/redux-slice/wizard.js b/src/app/redux-slice/wizard.js new file mode 100644 index 0000000..2de3c73 --- /dev/null +++ b/src/app/redux-slice/wizard.js @@ -0,0 +1,39 @@ +import { createSelector, createAsyncThunk, createSlice, } from '@reduxjs/toolkit'; +import { oraculumApiUrl_v1 } from "../../config" + +const initialState = { + wizard: { + actions: [], + providers: [], + }, +} + +export const fetchWizardData = createAsyncThunk('wizard/fetchWizardData', async () => { + const response = await fetch(`${oraculumApiUrl_v1}actions/all`) + const data = await response.json() + return data +}) + +const wizardSlice = createSlice({ + name: 'wizard', + initialState, + reducers: { + responseData: (state, action) => { + state.wizard = action.payload + } + }, + extraReducers: { + [fetchWizardData.fulfilled]: (state, action) => { + state.wizard = action.payload + }, + } +}); + +export const { responseData } = wizardSlice.actions; + +export const selectWizardData = createSelector( + (state) => state.wizard.wizard, + (state) => state +) + +export default wizardSlice.reducer; \ No newline at end of file diff --git a/src/app/store/store.js b/src/app/store/store.js new file mode 100644 index 0000000..8c7f7a3 --- /dev/null +++ b/src/app/store/store.js @@ -0,0 +1,15 @@ +import { configureStore } from '@reduxjs/toolkit'; +import { logger } from 'redux-logger' +import landingpageReducer from '../redux-slice/landingpage'; +import wizardReducer from '../redux-slice/wizard'; + + +const store = configureStore({ + reducer: { + landingpage: landingpageReducer, + wizard: wizardReducer, + }, + middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(logger), +}); + +export default store \ No newline at end of file diff --git a/src/constants/index.js b/src/constants/index.js deleted file mode 100644 index c6bfe99..0000000 --- a/src/constants/index.js +++ /dev/null @@ -1,6 +0,0 @@ -export default { - LOAD_DATA: 'LOAD_DATA', - LOAD_DATA_RESP: 'LOAD_DATA_RESP', - LOAD_WIZARD_DATA: 'LOAD_WIZARD_DATA', - LOAD_WIZARD_DATA_RESP: 'LOAD_WIZARD_DATA_RESP', -} diff --git a/src/index.js b/src/index.js index 35f417c..e953107 100644 --- a/src/index.js +++ b/src/index.js @@ -1,25 +1,11 @@ import React from 'react'; import ReactDOM from 'react-dom'; - -import './index.css'; -//import 'bootstrap/dist/css/bootstrap.min.css'; - +import { Provider } from 'react-redux' import 'typeface-open-sans' - +import './index.css'; import App from './App'; import * as serviceWorker from './serviceWorker'; - -import { createStore, applyMiddleware } from 'redux' -import thunkMiddleware from 'redux-thunk' -import { createLogger } from 'redux-logger' -import { Provider } from 'react-redux' -import reducer from './reducers' - -const loggerMiddleware = createLogger(); -const store = createStore(reducer, applyMiddleware( - thunkMiddleware, - loggerMiddleware -)); +import store from './app/store/store' ReactDOM.render( diff --git a/src/landingpage/Blockers.js b/src/landingpage/Blockers.js index 7b0ca1b..6696977 100644 --- a/src/landingpage/Blockers.js +++ b/src/landingpage/Blockers.js @@ -1,11 +1,17 @@ import React from "react" +import { useSelector } from 'react-redux' import SourceLink from "./SourceLink" -import Stats from "./Stats" +import BugStats from "./BugStats" +import { selectLandingpageData } from "../app/redux-slice/landingpage" -const Blockers = ({data, release}) => { +const Blockers = () => { + const data = useSelector(selectLandingpageData) + const blockerbugs = data.blockerbugs + const release = data.devel + if (data) return ( -
    + <>

    {

    - -
    + + ) } diff --git a/src/landingpage/BugStats.js b/src/landingpage/BugStats.js new file mode 100644 index 0000000..12eb7bb --- /dev/null +++ b/src/landingpage/BugStats.js @@ -0,0 +1,67 @@ +import React from "react" +import { Row } from "reactstrap" + +const BugStats = ({data}) => ( + +
    + + + + + + + + + + + + + + + + + + + + + + + + +
    + Beta +
    Proposed Blockers{data.beta_blockers_proposed}
    Accepted Blockers{data.beta_blockers}
    Proposed FEs{data.beta_fe_proposed}
    Accepted FEs{data.beta_fe}
    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + +
    + Final +
    Proposed Blockers{data.final_blockers_proposed}
    Accepted Blockers{data.final_blockers}
    Proposed FEs{data.final_fe_proposed}
    Accepted FEs{data.final_fe}
    +
    +     +) + +export default BugStats \ No newline at end of file diff --git a/src/landingpage/Event.js b/src/landingpage/Event.js deleted file mode 100644 index 4408d5b..0000000 --- a/src/landingpage/Event.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from "react" - -const Event = ({start, summary, link}) => ( -
  • - {start} -
    - - {summary} - -
    -
    • -) - -export default Event \ No newline at end of file diff --git a/src/landingpage/Events.js b/src/landingpage/Events.js index a236cc7..86666a0 100644 --- a/src/landingpage/Events.js +++ b/src/landingpage/Events.js @@ -1,23 +1,30 @@ import React from "react" +import { useSelector } from 'react-redux' import SourceLink from './SourceLink' import Meetings from "./Meetings" +import { selectLandingpageData } from "../app/redux-slice/landingpage" -const Events = ({data}) => ( - -) +const Events = () => { + const data = useSelector(selectLandingpageData) + const meetings = data.meetings + + return ( + <> +

    + + Meetings and testdays in the next 7 days{" "} + + +

    +
      + +
    + + ) +} export default Events diff --git a/src/landingpage/Hideable.js b/src/landingpage/Hideable.js index aac075a..3ecad1a 100644 --- a/src/landingpage/Hideable.js +++ b/src/landingpage/Hideable.js @@ -1,37 +1,33 @@ -import React, { Component } from "react" +import React from "react" import _ from "lodash" -class Hideable extends Component { - constructor(props) { - super(props) - this.id = _.uniqueId("hideable-id-") - } +const Hideable = (props) => { + const id = _.uniqueId("hideable-id-") - render() { - if (this.props.component_name === undefined) { - return
    - } - return ( - - ) + if (props.component_name === undefined) { + return
    } + + return ( + + ) } export default Hideable diff --git a/src/landingpage/LandingPage.js b/src/landingpage/LandingPage.js index 360f5a6..42d17e7 100644 --- a/src/landingpage/LandingPage.js +++ b/src/landingpage/LandingPage.js @@ -1,143 +1,125 @@ -import React, { Component } from "react" +import React, { useEffect, useState } from "react" +import { useDispatch } from 'react-redux' import { Container, Row } from "reactstrap" import { Link } from "react-router-dom" +import _ from "lodash" +import Cookies from "universal-cookie" import Layout from "../layout/Layout" import Timeline from "./Timeline" import Events from "./Events" import Blockers from "./Blockers" import Minutes from "./Minutes" import Hideable from "./Hideable" +import { fetchLandingpageData } from "../app/redux-slice/landingpage" -import _ from "lodash" - -import { connect } from "react-redux" -import { loadData } from "../actions/reduxActions" +const LandingPage = (props) => { + const dispatch = useDispatch() -import Cookies from "universal-cookie" + const cookies = new Cookies() + let available_components = ["events", "blockers", "minutes"] + let enabled__components = cookies.get("landingpage_enabled_components") -class LandingPage extends Component { - constructor(props) { - super(props) - this.cookies = new Cookies() - this.available_components = ["events", "blockers", "minutes"] - let enabled_components = this.cookies.get("landingpage_enabled_components") - if (enabled_components === undefined) { - enabled_components = this.available_components.slice() - this.cookies.set("landingpage_enabled_components", enabled_components, { path: "/" }) - } - this.state = { - blockerbugs: {}, - devel: 0, - meetings: [], - schedule: [], - last_qa_meeting: {}, - stable: 0, - config_mode: false, - enabled_components: enabled_components, - } + if (enabled__components === undefined) { + enabled__components = available_components.slice() + cookies.set("landingpage_enabled_components", enabled__components, { path: "/" }) } - componentDidMount() { - this.props.dispatch(loadData()) - } + const [config_mode, setConfig_mode] = useState(false) + const [enabled_components, setEnabled_components] = useState(enabled__components) + + useEffect(() => { + dispatch(fetchLandingpageData()) + }, [dispatch]) - toggle_config_mode(e) { - let config_mode = !this.state.config_mode - this.setState({ config_mode: config_mode }) + const toggle_config_mode = (e) => { + setConfig_mode(!config_mode) e.preventDefault() } - toggle_component_visibility(e, name) { + const toggle_component_visibility = (e, name) => { if (name === undefined) { e.preventDefault() return } - let enabled_components = this.state.enabled_components - if (enabled_components.includes(name)) { - enabled_components.splice(enabled_components.indexOf(name), 1) + let enabled__components = enabled_components + if (enabled__components.includes(name)) { + enabled__components.splice(enabled__components.indexOf(name), 1) } else { - enabled_components.push(name) - enabled_components = this.available_components.filter((c) => enabled_components.includes(c)) + enabled__components.push(name) + enabled__components = available_components.filter((c) => enabled__components.includes(c)) } - this.cookies.set("landingpage_enabled_components", enabled_components, { path: "/" }) - this.setState({ enabled_components: enabled_components }) + cookies.set("landingpage_enabled_components", enabled__components, { path: "/" }) + setEnabled_components(enabled__components) e.preventDefault() } - render() { - const available_components = { - events: , - blockers: , - minutes: , - } - let components = _.chunk( - this.state.config_mode ? this.available_components : this.state.enabled_components, - 2 - ) + available_components = { + events: , + blockers: , + minutes: , + } - components = components.map((row) => ( - - {row.map((item) => ( -
    - - {available_components[item]} - -
    - ))} -     - )) + let components = _.chunk( + config_mode ? available_components : enabled_components, + 2 + ) - return ( - -
    - - -
    - -
    -     -     + components = components.map((row) => ( + + {row.map((item) => ( +
    + + {available_components[item]} +
    + ))} +     + )) + + return ( + +
    - {components} - - - - -
    - - Do you have some spare time? Feeling like helping others? Wanna improve Fedora? - Click here! - + +
    +
    - - ) - } -} - -const mapStateToProps = (state) => { - return { - ...state.landing_page, - } +
    + + {components} + + + + +
    + + Do you have some spare time? Feeling like helping others? Wanna improve Fedora? + Click here! + +
    +     +     + + ) } -export default connect(mapStateToProps)(LandingPage) +export default LandingPage diff --git a/src/landingpage/Line.js b/src/landingpage/Line.js deleted file mode 100644 index 932366a..0000000 --- a/src/landingpage/Line.js +++ /dev/null @@ -1,16 +0,0 @@ -import React from "react" - -const Line = ({color}) => { - const lineStyle = { - stroke: color, - strokeWidth: "3", - } - return ( - - - - - ) -} - -export default Line \ No newline at end of file diff --git a/src/landingpage/Lines.js b/src/landingpage/Lines.js index 62db822..04c3df9 100644 --- a/src/landingpage/Lines.js +++ b/src/landingpage/Lines.js @@ -1,5 +1,4 @@ import React from "react" -import Line from "./Line" const Lines = ({data}) => { return data.map((milestone) => { @@ -11,4 +10,17 @@ const Lines = ({data}) => { }) } +const Line = ({color}) => { + const lineStyle = { + stroke: color, + strokeWidth: "3", + } + return ( + + + + + ) +} + export default Lines \ No newline at end of file diff --git a/src/landingpage/Meetings.js b/src/landingpage/Meetings.js index e9454ce..78e795b 100644 --- a/src/landingpage/Meetings.js +++ b/src/landingpage/Meetings.js @@ -1,12 +1,10 @@ import React from "react" import dateFormat from "dateformat" -import Event from "./Event" - const Meetings = ({data}) => { return data.map((meeting) => { const old = new Date(meeting.start) - var meeting_start = dateFormat( + let meeting_start = dateFormat( new Date(old.getTime() - old.getTimezoneOffset() * 60000), "d mmm yyyy - HH:MM" ) @@ -25,4 +23,15 @@ const Meetings = ({data}) => { }) } +const Event = ({start, summary, link}) => ( +
  • + {start} +
    + + {summary} + +
    +
    • +) + export default Meetings \ No newline at end of file diff --git a/src/landingpage/Minutes.js b/src/landingpage/Minutes.js index 80b3012..f9e2b12 100644 --- a/src/landingpage/Minutes.js +++ b/src/landingpage/Minutes.js @@ -1,24 +1,31 @@ import React from "react" +import { useSelector } from 'react-redux' +import { selectLandingpageData } from "../app/redux-slice/landingpage" -const Minutes = ({data}) => ( -
    -

    Fedora QA Meeting Minutes

    -
    - - Latest minutes from {data.date} - -
    - Visit{" "} - - meetbot - {" "} - to see older. -
    -
    -
    -) +const Minutes = () => { + const data = useSelector(selectLandingpageData) + const last_qa_meeting = data.last_qa_meeting + + return ( + <> +

    Fedora QA Meeting Minutes

    +
    + + Latest minutes from {last_qa_meeting.date} + +
    + Visit{" "} + + meetbot + {" "} + to see older. +
    +
    + + ) +} export default Minutes diff --git a/src/landingpage/Stats.js b/src/landingpage/Stats.js deleted file mode 100644 index e2d9b26..0000000 --- a/src/landingpage/Stats.js +++ /dev/null @@ -1,67 +0,0 @@ -import React from "react" -import { Row } from "reactstrap" - -const Stats = ({data}) => ( - -
    - - - - - - - - - - - - - - - - - - - - - - - - -
    - Beta -
    Proposed Blockers{data.beta_blockers_proposed}
    Accepted Blockers{data.beta_blockers}
    Proposed FEs{data.beta_fe_proposed}
    Accepted FEs{data.beta_fe}
    -
    -
    - - - - - - - - - - - - - - - - - - - - - - - - -
    - Final -
    Proposed Blockers{data.final_blockers_proposed}
    Accepted Blockers{data.final_blockers}
    Proposed FEs{data.final_fe_proposed}
    Accepted FEs{data.final_fe}
    -
    -     -) - -export default Stats \ No newline at end of file diff --git a/src/landingpage/Timeline.js b/src/landingpage/Timeline.js index b0c7c01..2ca908f 100644 --- a/src/landingpage/Timeline.js +++ b/src/landingpage/Timeline.js @@ -1,30 +1,38 @@ import React from "react" +import { useSelector } from 'react-redux' import SourceLink from './SourceLink' import Dates from "./Dates" import Lines from "./Lines" import Schedule from "./Schedule" +import { selectLandingpageData } from "../app/redux-slice/landingpage" + +const Timeline = () => { + const data = useSelector(selectLandingpageData) + const schedule = data.schedule + + return ( + <> +

    + + Current development schedule{" "} + + +

    +
    + + + + + + +
    +
    + + ) +} -const Timeline = ({data}) => ( -
    -

    - - Current development schedule{" "} - - -

    -
    - - - - - - -
    -
    -
    -) export default Timeline diff --git a/src/layout/Footer.js b/src/layout/Footer.js index f6cd591..d69a2c6 100644 --- a/src/layout/Footer.js +++ b/src/layout/Footer.js @@ -1,16 +1,12 @@ -import React, { Component } from "react" +import React from "react" -class Footer extends Component { - render() { - return ( -
    -
    - Source on Pagure{" "} - version 0.1.0 -
    -
    - ) - } -} +const Footer = () => ( +
    +
    + Source on Pagure{" "} + version 0.1.0 +
    +
    +) export default Footer diff --git a/src/layout/Layout.js b/src/layout/Layout.js index 17b4499..9f84730 100644 --- a/src/layout/Layout.js +++ b/src/layout/Layout.js @@ -1,16 +1,34 @@ -import React, { Component } from "react" +import React from "react" +import { useSelector } from 'react-redux' import Masthead from "./Masthead" import Footer from "./Footer" +import { selectWizardData } from "../app/redux-slice/wizard" +import { selectLandingpageData } from "../app/redux-slice/landingpage" -class Layout extends Component { - render() { - const { loading } = this.props +const Layout = (props) => { + const landingpageData = useSelector(selectLandingpageData) + const landingpageDataLoading = landingpageData.stable === 0 + + const wizardData = useSelector(selectWizardData) + const wizardDataLoading = wizardData.providers.length === 0 + + if (props.landingpageRoute) { + return ( + <> + + {landingpageDataLoading ? null : props.children} +