geindre/application-amicale
1
0
Fork 0
forked from vergnet/application-amicale
Code Issues Pull requests Releases Wiki Activity

Fix for theme not updating

Browse source
This commit is contained in:
Arnaud Vergnet 2020-04-09 23:30:42 +02:00
parent 9f391fc335
commit 9bdfe3944e
3 changed files with 53 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
src/components/Custom/CustomAgenda.js
View file

@ -1,46 +1,59 @@
import * as React from 'react';
import {View} from "react-native";
import {withTheme} from 'react-native-paper';
import {Agenda} from "react-native-calendars";
type Props = {
theme: Object,
}
/**
* Abstraction layer for Agenda component, using custom configuration
*
* @param props Props to pass to the element. Must specify an onRef prop to get an Agenda ref.
* @return {*}
*/
function CustomAgenda(props) {
const {colors} = props.theme;
return (
<Agenda
{...props}
ref={props.onRef}
class CustomAgenda extends React.Component<Props> {
getAgenda() {
return <Agenda
{...this.props}
ref={this.props.onRef}
theme={{
backgroundColor: colors.agendaBackgroundColor,
calendarBackground: colors.background,
textSectionTitleColor: colors.agendaDayTextColor,
selectedDayBackgroundColor: colors.primary,
backgroundColor: this.props.theme.colors.agendaBackgroundColor,
calendarBackground: this.props.theme.colors.background,
textSectionTitleColor: this.props.theme.colors.agendaDayTextColor,
selectedDayBackgroundColor: this.props.theme.colors.primary,
selectedDayTextColor: '#ffffff',
todayTextColor: colors.primary,
dayTextColor: colors.text,
textDisabledColor: colors.agendaDayTextColor,
dotColor: colors.primary,
todayTextColor: this.props.theme.colors.primary,
dayTextColor: this.props.theme.colors.text,
textDisabledColor: this.props.theme.colors.agendaDayTextColor,
dotColor: this.props.theme.colors.primary,
selectedDotColor: '#ffffff',
arrowColor: 'orange',
monthTextColor: colors.primary,
indicatorColor: colors.primary,
monthTextColor: this.props.theme.colors.primary,
indicatorColor: this.props.theme.colors.primary,
textDayFontWeight: '300',
textMonthFontWeight: 'bold',
textDayHeaderFontWeight: '300',
textDayFontSize: 16,
textMonthFontSize: 16,
textDayHeaderFontSize: 16,
agendaDayTextColor: colors.agendaDayTextColor,
agendaDayNumColor: colors.agendaDayTextColor,
agendaTodayColor: colors.primary,
agendaKnobColor: colors.primary,
agendaDayTextColor: this.props.theme.colors.agendaDayTextColor,
agendaDayNumColor: this.props.theme.colors.agendaDayTextColor,
agendaTodayColor: this.props.theme.colors.primary,
agendaKnobColor: this.props.theme.colors.primary,
}}
/>
);
/>;
}
render() {
if (this.props.theme.colors.text === "#ffffff") // We are in light mode
return (
<View style={{flex: 1}}>
{this.getAgenda()}
</View>
);
else
return this.getAgenda();
}
}
export default withTheme(CustomAgenda);

9
src/screens/Planning/PlanningScreen.js
View file

@ -40,7 +40,7 @@ const AGENDA_MONTH_SPAN = 3;
/**
* Class defining the app's planning screen
*/
export default class PlanningScreen extends React.Component<Props, State> {
class PlanningScreen extends React.Component<Props, State> {
agendaRef: Object;
@ -226,10 +226,15 @@ export default class PlanningScreen extends React.Component<Props, State> {
);
}
componentDidUpdate(prevProps: Props, prevState: State, prevContext: *): * {
console.log('coucou');
}
render() {
// console.log("rendering PlanningScreen");
return (
<CustomAgenda
{...this.props}
// the list of items that have to be displayed in agenda. If you want to render item as empty date
// the value of date key kas to be an empty array []. If there exists no value for date key it is
// considered that the date in question is not yet loaded
@ -259,3 +264,5 @@ export default class PlanningScreen extends React.Component<Props, State> {
);
}
}
export default PlanningScreen;

23
src/screens/Proximo/ProximoListScreen.js
View file

@ -4,9 +4,10 @@ import * as React from 'react';
import {FlatList, Image, Platform, ScrollView, View} from "react-native";
import i18n from "i18n-js";
import CustomModal from "../../components/Custom/CustomModal";
import {IconButton, RadioButton, Searchbar, Subheading, Text, Title, withTheme} from "react-native-paper";
import {RadioButton, Searchbar, Subheading, Text, Title, withTheme} from "react-native-paper";
import {stringMatchQuery} from "../../utils/Search";
import ProximoListItem from "../../components/Lists/ProximoListItem";
import HeaderButton from "../../components/Custom/HeaderButton";
function sortPrice(a, b) {
return a.price - b.price;
@ -37,6 +38,7 @@ const LIST_ITEM_HEIGHT = 84;
type Props = {
navigation: Object,
route: Object,
theme: Object,
}
type State = {
@ -54,8 +56,6 @@ class ProximoListScreen extends React.Component<Props, State> {
listData: Array<Object>;
shouldFocusSearchBar: boolean;
colors: Object;
constructor(props) {
super(props);
this.listData = this.props.route.params['data']['data'];
@ -65,8 +65,6 @@ class ProximoListScreen extends React.Component<Props, State> {
currentSortMode: 3,
modalCurrentDisplayItem: null,
};
this.colors = props.theme.colors;
}
@ -104,14 +102,7 @@ class ProximoListScreen extends React.Component<Props, State> {
* @return {*}
*/
getSortMenuButton = () => {
return (
<IconButton
icon="sort"
color={this.colors.text}
size={26}
onPress={this.onSortMenuPress}
/>
);
return <HeaderButton icon="sort" onPress={this.onSortMenuPress}/>;
};
/**
@ -164,11 +155,11 @@ class ProximoListScreen extends React.Component<Props, State> {
getStockColor(availableStock: number) {
let color: string;
if (availableStock > 3)
color = this.colors.success;
color = this.props.theme.colors.success;
else if (availableStock > 0)
color = this.colors.warning;
color = this.props.theme.colors.warning;
else
color = this.colors.danger;
color = this.props.theme.colors.danger;
return color;
}