Application Android et IOS pour l'amicale des élèves
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

SelfMenuScreen.tsx 5.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  1. /*
  2. * Copyright (c) 2019 - 2020 Arnaud Vergnet.
  3. *
  4. * This file is part of Campus INSAT.
  5. *
  6. * Campus INSAT is free software: you can redistribute it and/or modify
  7. * it under the terms of the GNU General Public License as published by
  8. * the Free Software Foundation, either version 3 of the License, or
  9. * (at your option) any later version.
  10. *
  11. * Campus INSAT is distributed in the hope that it will be useful,
  12. * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  14. * GNU General Public License for more details.
  15. *
  16. * You should have received a copy of the GNU General Public License
  17. * along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
  18. */
  19. import * as React from 'react';
  20. import {View} from 'react-native';
  21. import {Card, Text, withTheme} from 'react-native-paper';
  22. import {StackNavigationProp} from '@react-navigation/stack';
  23. import i18n from 'i18n-js';
  24. import DateManager from '../../managers/DateManager';
  25. import WebSectionList from '../../components/Screens/WebSectionList';
  26. import type {SectionListDataType} from '../../components/Screens/WebSectionList';
  27. const DATA_URL =
  28. 'https://etud.insa-toulouse.fr/~amicale_app/menu/menu_data.json';
  29. type PropsType = {
  30. navigation: StackNavigationProp<any>;
  31. theme: ReactNativePaper.Theme;
  32. };
  33. export type RuFoodCategoryType = {
  34. name: string;
  35. dishes: Array<{name: string}>;
  36. };
  37. type RuMealType = {
  38. name: string;
  39. foodcategory: Array<RuFoodCategoryType>;
  40. };
  41. type RawRuMenuType = {
  42. restaurant_id: number;
  43. id: number;
  44. date: string;
  45. meal: Array<RuMealType>;
  46. };
  47. /**
  48. * Class defining the app's menu screen.
  49. */
  50. class SelfMenuScreen extends React.Component<PropsType> {
  51. /**
  52. * Formats the given string to make sure it starts with a capital letter
  53. *
  54. * @param name The string to format
  55. * @return {string} The formatted string
  56. */
  57. static formatName(name: string): string {
  58. return name.charAt(0) + name.substr(1).toLowerCase();
  59. }
  60. /**
  61. * Creates the dataset to be used in the FlatList
  62. *
  63. * @param fetchedData
  64. * @return {[]}
  65. */
  66. createDataset = (
  67. fetchedData: Array<RawRuMenuType>,
  68. ): SectionListDataType<RuFoodCategoryType> => {
  69. let result: SectionListDataType<RuFoodCategoryType> = [];
  70. if (fetchedData == null || fetchedData.length === 0) {
  71. result = [
  72. {
  73. title: i18n.t('general.notAvailable'),
  74. data: [],
  75. keyExtractor: this.getKeyExtractor,
  76. },
  77. ];
  78. } else {
  79. fetchedData.forEach((item: RawRuMenuType) => {
  80. result.push({
  81. title: DateManager.getInstance().getTranslatedDate(item.date),
  82. data: item.meal[0].foodcategory,
  83. keyExtractor: this.getKeyExtractor,
  84. });
  85. });
  86. }
  87. return result;
  88. };
  89. /**
  90. * Gets the render section header
  91. *
  92. * @param section The section to render the header from
  93. * @return {*}
  94. */
  95. getRenderSectionHeader = ({section}: {section: {title: string}}) => {
  96. return (
  97. <Card
  98. style={{
  99. width: '95%',
  100. marginLeft: 'auto',
  101. marginRight: 'auto',
  102. marginTop: 5,
  103. marginBottom: 5,
  104. elevation: 4,
  105. }}>
  106. <Card.Title
  107. title={section.title}
  108. titleStyle={{
  109. textAlign: 'center',
  110. }}
  111. subtitleStyle={{
  112. textAlign: 'center',
  113. }}
  114. style={{
  115. paddingLeft: 0,
  116. }}
  117. />
  118. </Card>
  119. );
  120. };
  121. /**
  122. * Gets a FlatList render item
  123. *
  124. * @param item The item to render
  125. * @return {*}
  126. */
  127. getRenderItem = ({item}: {item: RuFoodCategoryType}) => {
  128. const {theme} = this.props;
  129. return (
  130. <Card
  131. style={{
  132. flex: 0,
  133. marginHorizontal: 10,
  134. marginVertical: 5,
  135. }}>
  136. <Card.Title style={{marginTop: 5}} title={item.name} />
  137. <View
  138. style={{
  139. width: '80%',
  140. marginLeft: 'auto',
  141. marginRight: 'auto',
  142. borderBottomWidth: 1,
  143. borderBottomColor: theme.colors.primary,
  144. marginTop: 5,
  145. marginBottom: 5,
  146. }}
  147. />
  148. <Card.Content>
  149. {item.dishes.map((object: {name: string}) =>
  150. object.name !== '' ? (
  151. <Text
  152. style={{
  153. marginTop: 5,
  154. marginBottom: 5,
  155. textAlign: 'center',
  156. }}>
  157. {SelfMenuScreen.formatName(object.name)}
  158. </Text>
  159. ) : null,
  160. )}
  161. </Card.Content>
  162. </Card>
  163. );
  164. };
  165. /**
  166. * Extract a key for the given item
  167. *
  168. * @param item The item to extract the key from
  169. * @return {*} The extracted key
  170. */
  171. getKeyExtractor = (item: RuFoodCategoryType): string => item.name;
  172. render() {
  173. const {navigation} = this.props;
  174. return (
  175. <WebSectionList
  176. createDataset={this.createDataset}
  177. navigation={navigation}
  178. autoRefreshTime={0}
  179. refreshOnFocus={false}
  180. fetchUrl={DATA_URL}
  181. renderItem={this.getRenderItem}
  182. renderSectionHeader={this.getRenderSectionHeader}
  183. stickyHeader
  184. />
  185. );
  186. }
  187. }
  188. export default withTheme(SelfMenuScreen);