Commit 1d9b7bd2 authored by mgabdev's avatar mgabdev

Added ProgressInjection

• Added:
- ProgressInjection for monthly funding progress
parent f7fc626c
import React from 'react'
import PropTypes from 'prop-types'
import { injectIntl, defineMessages } from 'react-intl'
import { monthlyExpensesComplete } from '../../initial_state'
import {
URL_DISSENTER_SHOP,
URL_DISSENTER_SHOP_DONATIONS,
} from '../../constants'
import TimelineInjectionLayout from './timeline_injection_layout'
import ProgressBar from '../progress_bar'
import Button from '../button'
import Text from '../text'
class ProgressInjection extends React.PureComponent {
render() {
const {
intl,
isXS,
injectionId,
} = this.props
if (!monthlyExpensesComplete || !isXS) return <div />
const value = Math.min(parseFloat(monthlyExpensesComplete), 100)
return (
<TimelineInjectionLayout
title={intl.formatMessage(messages.operationsTitle)}
subtitle={intl.formatMessage(messages.operationsSubtitle)}
buttonHref={URL_DISSENTER_SHOP}
buttonTitle={intl.formatMessage(messages.donationTitle)}
id={injectionId}
isXS={isXS}
>
<div className={[_s.d, _s.pt5, _s.pb15, _s.w100PC].join(' ')}>
<ProgressBar
progress={monthlyExpensesComplete}
title={intl.formatMessage(messages.progressTitle, { value })}
href={URL_DISSENTER_SHOP}
/>
</div>
</TimelineInjectionLayout>
)
}
}
const messages = defineMessages({
progressTitle: { id: 'progress_title', defaultMessage: '{value}% covered this month' },
operationsTitle: { id: 'operations_title', defaultMessage: "Gab's Operational Expenses" },
operationsSubtitle: { id: 'operations_subtitle', defaultMessage: 'We are 100% funded by you' },
donationTitle: { id: 'make_donation', defaultMessage: 'Make a Donation' },
})
ProgressInjection.propTypes = {
injectionId: PropTypes.string.isRequired,
}
export default injectIntl(ProgressInjection)
\ No newline at end of file
......@@ -2,6 +2,7 @@ import {
BREAKPOINT_EXTRA_SMALL,
TIMELINE_INJECTION_FEATURED_GROUPS,
TIMELINE_INJECTION_GROUP_CATEGORIES,
TIMELINE_INJECTION_PROGRESS,
TIMELINE_INJECTION_PRO_UPGRADE,
TIMELINE_INJECTION_PWA,
TIMELINE_INJECTION_SHOP,
......@@ -10,6 +11,7 @@ import {
import {
FeaturedGroupsInjection,
GroupCategoriesInjection,
ProgressInjection,
ProUpgradeInjection,
PWAInjection,
ShopInjection,
......@@ -26,6 +28,7 @@ const initialState = getWindowDimension()
const INJECTION_COMPONENTS = {}
INJECTION_COMPONENTS[TIMELINE_INJECTION_FEATURED_GROUPS] = FeaturedGroupsInjection
INJECTION_COMPONENTS[TIMELINE_INJECTION_GROUP_CATEGORIES] = GroupCategoriesInjection
INJECTION_COMPONENTS[TIMELINE_INJECTION_PROGRESS] = ProgressInjection
INJECTION_COMPONENTS[TIMELINE_INJECTION_PRO_UPGRADE] = ProUpgradeInjection
INJECTION_COMPONENTS[TIMELINE_INJECTION_PWA] = PWAInjection
INJECTION_COMPONENTS[TIMELINE_INJECTION_SHOP] = ShopInjection
......
......@@ -141,6 +141,7 @@ export const TOAST_TYPE_SUCCESS = 'success'
export const TIMELINE_INJECTION_FEATURED_GROUPS = 'TI_FEATURED_GROUPS'
export const TIMELINE_INJECTION_GROUP_CATEGORIES = 'TI_GROUP_CATEGORIES'
export const TIMELINE_INJECTION_PROGRESS = 'TI_PROGRESS'
export const TIMELINE_INJECTION_PRO_UPGRADE = 'TI_PRO_UPGRADE'
export const TIMELINE_INJECTION_PWA = 'TI_PWA'
export const TIMELINE_INJECTION_SHOP = 'TI_SHOP'
......
......@@ -8,6 +8,7 @@ import {
TIMELINE_INJECTION_WEIGHT_DEFAULT,
TIMELINE_INJECTION_FEATURED_GROUPS,
TIMELINE_INJECTION_GROUP_CATEGORIES,
TIMELINE_INJECTION_PROGRESS,
TIMELINE_INJECTION_PRO_UPGRADE,
TIMELINE_INJECTION_PWA,
TIMELINE_INJECTION_SHOP,
......@@ -26,6 +27,7 @@ const initialState = ImmutableMap({
injections: ImmutableMap({
[TIMELINE_INJECTION_FEATURED_GROUPS]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
[TIMELINE_INJECTION_GROUP_CATEGORIES]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
[TIMELINE_INJECTION_PROGRESS]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
[TIMELINE_INJECTION_PRO_UPGRADE]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
[TIMELINE_INJECTION_PWA]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
[TIMELINE_INJECTION_SHOP]: TIMELINE_INJECTION_WEIGHT_DEFAULT,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment