From 8484b4212e418a309e5e5f164d157ee27941eb20 Mon Sep 17 00:00:00 2001
From: Roland Osborne <roland.osborne@gmail.com>
Date: Fri, 28 Oct 2022 10:03:57 -0700
Subject: [PATCH] updated sort icon

---
 app/mobile/src/session/cards/Cards.jsx       | 27 ++++++++++----------
 app/mobile/src/session/cards/Cards.styled.js |  1 -
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/app/mobile/src/session/cards/Cards.jsx b/app/mobile/src/session/cards/Cards.jsx
index 959f1fc4..4fb6a785 100644
--- a/app/mobile/src/session/cards/Cards.jsx
+++ b/app/mobile/src/session/cards/Cards.jsx
@@ -3,7 +3,8 @@ import { FlatList, ScrollView, View, TextInput, TouchableOpacity, Text } from 'r
 import { styles } from './Cards.styled';
 import { useCards } from './useCards.hook';
 import { SafeAreaView } from 'react-native-safe-area-context';
-import Ionicons from '@expo/vector-icons/AntDesign';
+import AntIcons from '@expo/vector-icons/AntDesign';
+import MatIcons from '@expo/vector-icons/MaterialCommunityIcons';
 import { CardItem } from './cardItem/CardItem';
 import Colors from 'constants/Colors';
 import { useNavigation } from '@react-navigation/native';
@@ -15,22 +16,22 @@ export function CardsTitle({ state, actions, openRegistry }) {
     <View style={styles.title}>
       { state.sorting && (
         <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
-          <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} />
+          <MatIcons style={styles.icon} name="sort-alphabetical-ascending" size={18} color={Colors.text} />
         </TouchableOpacity>
       )}
       { !state.sorting && (
         <TouchableOpacity style={styles.sort} onPress={actions.sort}>
-          <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
+          <MatIcons style={styles.icon} name="sort-alphabetical-ascending" size={18} color={Colors.disabled} />
         </TouchableOpacity>
       )}
       <View style={styles.inputwrapper}>
-        <Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
+        <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
         <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
             autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
         <View style={styles.space} />
       </View>
       <TouchableOpacity style={styles.add} onPress={() => openRegistry(navigation)}>
-        <Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
+        <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
         <Text style={styles.newtext}>New</Text>
       </TouchableOpacity>
     </View>
@@ -66,22 +67,22 @@ export function Cards({ openRegistry, openContact }) {
           <View style={styles.topbar}>
             { state.sorting && (
               <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
-                <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} />
+                <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.text} />
               </TouchableOpacity>
             )}
             { !state.sorting && (
               <TouchableOpacity style={styles.sort} onPress={actions.sort}>
-                <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
+                <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
               </TouchableOpacity>
             )}
             <View style={styles.inputwrapper}>
-              <Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
+              <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
               <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
                   autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
               <View style={styles.space} />
             </View>
             <TouchableOpacity style={styles.add} onPress={openRegistry}>
-              <Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
+              <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
               <Text style={styles.newtext}>New</Text>
             </TouchableOpacity>
           </View>
@@ -106,21 +107,21 @@ export function Cards({ openRegistry, openContact }) {
             <SafeAreaView edges={['top', 'right']} style={styles.searchbar}>
               { state.sorting && (
                 <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
-                  <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} />
+                  <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.text} />
                 </TouchableOpacity>
               )}
               { !state.sorting && (
                 <TouchableOpacity style={styles.sort} onPress={actions.sort}>
-                  <Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
+                  <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
                 </TouchableOpacity>
               )}
               <View style={styles.inputwrapper}>
-                <Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
+                <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
                 <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
                     autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
               </View>
               <TouchableOpacity style={styles.add} onPress={openRegistry}>
-                <Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
+                <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
               </TouchableOpacity>
             </SafeAreaView>
           </View>
diff --git a/app/mobile/src/session/cards/Cards.styled.js b/app/mobile/src/session/cards/Cards.styled.js
index a1e03f84..148ccc7f 100644
--- a/app/mobile/src/session/cards/Cards.styled.js
+++ b/app/mobile/src/session/cards/Cards.styled.js
@@ -99,7 +99,6 @@ export const styles = StyleSheet.create({
   },
   sort: {
     paddingRight: 12,
-    transform: [ { rotate: "270deg" }, ] 
   },
   findarea: {
     borderTopWidth: 1,