Gekidou - Account Screen (#5708)

* Added DrawerItem component * WIP Account Screen * Added react-native-paper * Added StatusLabel Component * Extracted i18n * TS fix DrawerItem component * WIP Account Screen * Added server name label under log out * Updated translation * WIP * Fixes the Offline text style * Added Metropolis fonts * WIP * Typo clean up * WIP * WIP * WIP * Added server display name * Writing OpenSans properly * WIP * WIP * Added OptionsModal * Opening OptionsModal * Added translation keys * Writes status to local db * Fix missing translation * Fix OptionModal not dismissing * Pushing status to server * Refactored * Added CustomStatusExpiry component * Added sub components * Added CustomLabel * CustomStatus WIP * Added Custom Status screen WIP * WIP - unsetCustomStatus and CustomStatus constant * WIP * WIP * WIP * WIP * WIP * WIP * WIP * Retrieving RecentCustomStatuses from Preferences table * WIP * WIP * WIP * Added Clear After Modal * WIP - Transations * WIP * Done with showing modal cst * wip * Clear After Modal - DONE * fix * Added missing API calls * wip * Causing screen refresh * wip * WIP * WIP * WIP * Code clean up * Added OOO alert box * Refactored Options-Item * Refactored OptionsModalList component * Opening 'status' in BottomSheet instead of OptionsModal * AddReaction screen - WIP * Add Reaction screen - WIP * Added EmojiPickerRow * Added @components/emoji_picker - WIP * Emoji Picker - WIP * WIP * WIP * WIP * SectionList - WIP * Installed react-native-section_list_get_item_layout * Adding API calls - WIP * WIP * Search Bar component - WIP * WIP * WIP * WIP * Rendering Emoticons now - have to tackle some fixmes * Code clean up * Code clean up - WIP * Code clean up * WIP * Major clean up * wip * WIP * Fix rendering issue with SectionIcons and SearchBar * Tackled the CustomEmojiPage * Code clean up * WIP * Done with loading User Profiles for Custom Emoji * Code clean up * Code Clean up * Fix screen Account * Added missing sql file for IOS Pod * Updated Podfile.lock * Using queryConfig instead of queryCommonSystemValues * Fix - Custom status * Fix - Custom Status - Error * Fix - Clear Pass Status - WIP * Fix - Custom Status Clear * Need to fix CST clear * WIP * Status clear - working * Using catchError operator * remove unnecessary prop * Status BottomSheet now has colored indicators * Added KeyboardTrackingView from 'react-native-keyboard-tracking-view' * Code clean up * WIP * code clean up * Added a safety check * Fix - Display suggestions * Code clean up based on PR Review * Code clean up * Code clean up * Code clean up * Corrections * Fix tsc * TS fix * Removed unnecessary prop * Fix SearchBar Ts * Updated tests * Delete search_bar.test.js.snap * Merge branch 'gekidou' into gekidou_account_screen * Revert "Merge branch 'gekidou' into gekidou_account_screen" This reverts commit 5defc31321. * Fix fonts * Refactor home account screen * fix theme provider * refactor bottom sheet * remove paper provider * update drawer item snapshots * Remove options modal screen * remove react-native-ui-lib dependency * Refactor & fix custom status & navigation (including tablet) * Refactor emoji picker Co-authored-by: Avinash Lingaloo <> Co-authored-by: Elias Nahum <nahumhbl@gmail.com>
2021-10-12 19:24:24 +04:00
parent 0807a20946
commit 7f91a6a78a
101 changed files with 5818 additions and 315 deletions
--- a/app/utils/theme/index.ts
+++ b/app/utils/theme/index.ts
@@ -4,6 +4,7 @@
 import {StyleSheet} from 'react-native';
 import tinyColor from 'tinycolor2';

+import {Preferences, Screens} from '@constants';
 import {mergeNavigationOptions} from '@screens/navigation';
 import EphemeralStore from '@store/ephemeral_store';

@@ -119,7 +120,9 @@ export function setNavigatorStyles(componentId: string, theme: Theme) {

 export function setNavigationStackStyles(theme: Theme) {
    EphemeralStore.allNavigationComponentIds.forEach((componentId) => {
-        setNavigatorStyles(componentId, theme);
+        if (componentId !== Screens.BOTTOM_SHEET) {
+            setNavigatorStyles(componentId, theme);
+        }
    });
 }

@@ -206,3 +209,56 @@ export function blendColors(background: string, foreground: string, opacity: num

    return `rgba(${red},${green},${blue},${alpha})`;
 }
+
+const themeTypeMap: ThemeTypeMap = {
+    Mattermost: 'denim',
+    Organization: 'sapphire',
+    'Mattermost Dark': 'indigo',
+    'Windows Dark': 'onyx',
+    Denim: 'denim',
+    Sapphire: 'sapphire',
+    Quartz: 'quartz',
+    Indigo: 'indigo',
+    Onyx: 'onyx',
+    custom: 'custom',
+};
+
+// setThemeDefaults will set defaults on the theme for any unset properties.
+export function setThemeDefaults(theme: Theme): Theme {
+    const themes = Preferences.THEMES as Record<ThemeKey, Theme>;
+    const defaultTheme = themes.denim;
+
+    const processedTheme = {...theme};
+
+    // If this is a system theme, return the source theme object matching the theme preference type
+    if (theme.type && theme.type !== 'custom' && Object.keys(themeTypeMap).includes(theme.type)) {
+        return Preferences.THEMES[themeTypeMap[theme.type]];
+    }
+
+    for (const key of Object.keys(defaultTheme)) {
+        if (theme[key]) {
+            // Fix a case where upper case theme colours are rendered as black
+            processedTheme[key] = theme[key]?.toLowerCase();
+        }
+    }
+
+    for (const property in defaultTheme) {
+        if (property === 'type' || (property === 'sidebarTeamBarBg' && theme.sidebarHeaderBg)) {
+            continue;
+        }
+        if (theme[property] == null) {
+            processedTheme[property] = defaultTheme[property];
+        }
+
+        // Backwards compatability with old name
+        if (!theme.mentionBg && theme.mentionBj) {
+            processedTheme.mentionBg = theme.mentionBj;
+        }
+    }
+
+    if (!theme.sidebarTeamBarBg && theme.sidebarHeaderBg) {
+        processedTheme.sidebarTeamBarBg = blendColors(theme.sidebarHeaderBg, '#000000', 0.2, true);
+    }
+
+    return processedTheme as Theme;
+}