@messenger-box/slack-ui-mobile 10.0.3-alpha.23 → 10.0.3-alpha.30

package/lib/components/SlackSearchInput/Suggestion.js

@@ -1,4 +1,4 @@
-import React__default from'react';import {Pressable,StyleSheet,Text}from'react-native';var __defProp = Object.defineProperty;
+import React__default from'react';import {StyleSheet,Pressable,Text}from'react-native';var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;

package/lib/components/SlackSearchInput/Tag.js

@@ -1,4 +1,4 @@
-import React__default from'react';import {Pressable,Text,StyleSheet}from'react-native';var __defProp = Object.defineProperty;
+import React__default from'react';import {StyleSheet,Pressable,Text}from'react-native';var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;

package/lib/components/SlackSearchInput/index.js

@@ -1,4 +1,4 @@
-import React__default,{useState,useRef,useEffect,useCallback}from'react';import {View,StyleSheet,TextInput}from'react-native';import Suggestion from'./Suggestion.js';import Tag from'./Tag.js';import {HStack,Box,FlatList}from'@admin-layout/gluestack-ui-mobile';var __defProp = Object.defineProperty;
+import React__default,{useState,useRef,useEffect,useCallback}from'react';import {StyleSheet,View,TextInput}from'react-native';import Suggestion from'./Suggestion.js';import Tag from'./Tag.js';import {HStack,Box,FlatList}from'@admin-layout/gluestack-ui-mobile';var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;

package/lib/compute.js

@@ -641,10 +641,7 @@ const slackUiPageStore = [{
     }
   },
   componentPath: "@messenger-box/slack-ui-mobile/lib/screens/Teams/Teams.js",
-  hasComponent: true,
-  queries: {
-    GetOrganizationTeamsDocument: "{orgName: params.orgName}"
-  }
+  hasComponent: true
 }, {
   key: "teamview",
   path: "/:orgName/teamview",

package/lib/routes.json

@@ -699,10 +699,7 @@
         }
       },
       "componentPath": "@messenger-box/slack-ui-mobile/lib/screens/Teams/Teams.js",
-      "hasComponent": true,
-      "queries": {
-        "GetOrganizationTeamsDocument": "{orgName: params.orgName}"
-      }
+      "hasComponent": true
     }
   },
   {

package/lib/screens/Channels/Channels.js

@@ -1,4 +1,4 @@
-import React__default,{useState,useEffect}from'react';import {SafeAreaView,TouchableHighlight,StyleSheet,Dimensions}from'react-native';import {Box,Text,Button,ButtonText,Input,InputSlot,InputIcon,SearchIcon,InputField,Divider,VStack,FlatList,Spinner,HStack}from'@admin-layout/gluestack-ui-mobile';import Colors from'../../constants/Colors.js';import {NavigationRoutes}from'../../constants/routes.js';import {RoomType}from'common';import {useGetChannelsByUserQuery}from'common/graphql';import {useNavigation,useIsFocused,useFocusEffect}from'@react-navigation/native';import {FontAwesome,Octicons}from'@expo/vector-icons';import colors from'tailwindcss/colors';import'expo-font';import'expo-splash-screen';import {useDrawerLayout}from'../../hooks/useDrawerLayout.js';import'../../hooks/useExpoNotificationProvider.js';import {uniqBy}from'lodash-es';Dimensions.get("window").width;
+import React__default,{useState,useCallback,useEffect}from'react';import {SafeAreaView,StyleSheet,Dimensions}from'react-native';import {Box,Text,Button,ButtonText,Pressable,HStack,VStack,Center,Spinner,Heading,Input,InputSlot,InputIcon,SearchIcon,InputField,FlatList}from'@admin-layout/gluestack-ui-mobile';import {NavigationRoutes}from'../../constants/routes.js';import {RoomType}from'common';import {useGetChannelsByUserQuery}from'common/graphql';import {useIsFocused,useFocusEffect}from'@react-navigation/native';import {MaterialIcons,FontAwesome,Octicons}from'@expo/vector-icons';import colors from'tailwindcss/colors';import {StatusBar}from'expo-status-bar';import'expo-font';import'expo-splash-screen';import {useDrawerLayout}from'../../hooks/useDrawerLayout.js';import'../../hooks/useExpoNotificationProvider.js';import {uniqBy}from'lodash-es';Dimensions.get("window").width;
 Dimensions.get("window").height;
 const defaultChannelType = [RoomType.Channel, RoomType.Private, RoomType.Public];
 const Channels = ({
@@ -6,13 +6,12 @@ const Channels = ({
   route
 }) => {
   const {
-    orgName,
-    organizationDetail
+    orgName
   } = useDrawerLayout();
-  useNavigation();
   useIsFocused();
   const [channels, setChannels] = useState([]);
   const [intialChannels, setInitialChannels] = useState([]);
+  const [searchQuery, setSearchQuery] = useState("");
   const {
     data: channelsData,
     loading,
@@ -26,9 +25,10 @@ const Channels = ({
         team: null
       },
       limit: 50
-    }
+    },
+    skip: !orgName
   });
-  useFocusEffect(React__default.useCallback(() => {
+  useFocusEffect(useCallback(() => {
     if (orgName) {
       refetch({
         criteria: {
@@ -41,39 +41,39 @@ const Channels = ({
     }
     return () => {
     };
-  }, [orgName]));
+  }, [orgName, refetch]));
   useEffect(() => {
-    var _a, _b, _c;
+    var _a, _b;
     if (channelsData) {
-      let channels2 = (_a = channelsData == null ? void 0 : channelsData.channelsByUser) == null ? void 0 : _a.filter((i) => i.type !== RoomType.Direct);
-      channels2 = (_c = (_b = channels2 == null ? void 0 : channels2.slice()) == null ? void 0 : _b.sort((a, b) => a.title.localeCompare(b.title))) != null ? _c : [];
-      setChannels((oldChannels) => uniqBy([...channels2, ...oldChannels], ({
+      const newChannels = ((_b = (_a = channelsData == null ? void 0 : channelsData.channelsByUser) == null ? void 0 : _a.filter((i) => i.type !== RoomType.Direct)) == null ? void 0 : _b.sort((a, b) => a.title.localeCompare(b.title))) || [];
+      setChannels((oldChannels) => uniqBy([...newChannels, ...oldChannels], ({
         id
       }) => id));
-      setInitialChannels((oldChannels) => uniqBy([...channels2, ...oldChannels], ({
+      setInitialChannels((oldChannels) => uniqBy([...newChannels, ...oldChannels], ({
         id
       }) => id));
     }
   }, [channelsData]);
   useEffect(() => {
-    if (navigation)
+    if (navigation) {
       navigation.setOptions({
         headerTitleAlign: "left",
         headerTitleStyle: {
           borderBottomWidth: 1
         },
-        headerLeft: (props) => /* @__PURE__ */ React__default.createElement(Button, { onPress: () => navigation.goBack(), variant: "link" }, /* @__PURE__ */ React__default.createElement(ButtonText, null, "Cancel")),
-        headerRight: (props) => /* @__PURE__ */ React__default.createElement(Button, { onPress: () => navigation.navigate(NavigationRoutes.AddChannel, {
+        headerLeft: () => /* @__PURE__ */ React__default.createElement(Button, { onPress: () => navigation.goBack(), variant: "link" }, /* @__PURE__ */ React__default.createElement(ButtonText, null, /* @__PURE__ */ React__default.createElement(MaterialIcons, { name: "close", size: 24, color: "black" }))),
+        headerRight: () => /* @__PURE__ */ React__default.createElement(Button, { onPress: () => navigation.navigate(NavigationRoutes.AddChannel, {
           orgName
         }), variant: "link" }, /* @__PURE__ */ React__default.createElement(ButtonText, null, "Create")),
-        headerTitle: (props) => /* @__PURE__ */ React__default.createElement(Box, null, /* @__PURE__ */ React__default.createElement(Text, { color: colors.black, className: "text-[15] font-bold" }, "Channels")),
+        headerTitle: () => /* @__PURE__ */ React__default.createElement(Box, null, /* @__PURE__ */ React__default.createElement(Text, { color: colors.black, className: "text-[15] font-bold" }, "Channels")),
         headerStyle: {
           borderBottomWidth: 1,
           borderColor: "#d1d2d3"
         }
       });
-  }, [channels, navigation]);
-  const openInbox = (item) => {
+    }
+  }, [navigation, orgName]);
+  const openInbox = useCallback((item) => {
     var _a, _b, _c;
     navigation.navigate(NavigationRoutes.DialogMessages, {
       channelId: (_a = item == null ? void 0 : item.id) == null ? void 0 : _a.toString(),
@@ -81,94 +81,76 @@ const Channels = ({
       totalMembers: (_c = item == null ? void 0 : item.members) == null ? void 0 : _c.length,
       hideTabBar: true
     });
-  };
-  React__default.useMemo(() => {
-    const obj = channels.reduce((r, {
-      id,
-      title,
-      type,
-      members
-    }) => {
-      const l = title[0];
-      if (!r[l])
-        r[l] = [{
-          id,
-          title,
-          type,
-          members
-        }];
-      else
-        r[l].push({
-          id,
-          title,
-          type,
-          members
-        });
-      return r;
-    }, {});
-    const sorted = Object.entries(obj).sort(([a], [b]) => a.localeCompare(b));
-    const sortedFilteredData = sorted.map(([key, value]) => {
-      return {
-        title: key,
-        data: value
-      };
-    });
-    return sortedFilteredData;
-  }, [channels]);
-  const searchChannels = React__default.useCallback((v) => {
-    if (v) {
-      const searchedChannel = channels.filter((o) => {
+  }, [navigation]);
+  const searchChannels = useCallback((text) => {
+    setSearchQuery(text);
+    if (text) {
+      const searchedChannel = intialChannels.filter((o) => {
         var _a;
-        return (_a = o == null ? void 0 : o.title) == null ? void 0 : _a.toLowerCase().includes(v == null ? void 0 : v.toLowerCase());
+        return (_a = o == null ? void 0 : o.title) == null ? void 0 : _a.toLowerCase().includes(text == null ? void 0 : text.toLowerCase());
       });
       setChannels(searchedChannel);
     } else {
       setChannels(intialChannels);
     }
-  }, [intialChannels, channels]);
-  return /* @__PURE__ */ React__default.createElement(SafeAreaView, { style: {
-    flex: 1,
-    backgroundColor: "white"
-  } }, /* @__PURE__ */ React__default.createElement(Box, { className: "flex-1 bg-white" }, /* @__PURE__ */ React__default.createElement(Input, { style: {
-    boxShadow: "none"
-  }, variant: "outline", className: "bg-gray-100 mx-4 my-2 rounded-lg border-0" }, /* @__PURE__ */ React__default.createElement(InputSlot, { className: "pl-3" }, /* @__PURE__ */ React__default.createElement(InputIcon, { color: colors.black, as: SearchIcon })), /* @__PURE__ */ React__default.createElement(InputField, { type: "text", size: "xl", placeholder: "Search", placeholderTextColor: "#404040", className: "px-3 items-center font-[15] color-black", onChange: ({
-    nativeEvent: {
-      eventCount,
-      target,
-      text
+  }, [intialChannels]);
+  const renderChannelIcon = useCallback((type) => {
+    if (type === RoomType.Private) {
+      return /* @__PURE__ */ React__default.createElement(FontAwesome, { color: "#525252", name: "lock", size: 18 });
+    } else {
+      return /* @__PURE__ */ React__default.createElement(Octicons, { color: "#525252", name: "hash", size: 18 });
     }
-  }) => {
-    searchChannels(text);
-  }, autoCapitalize: "none", autoCorrect: false })), /* @__PURE__ */ React__default.createElement(Divider, null), /* @__PURE__ */ React__default.createElement(Box, { className: "flex-1" }, /* @__PURE__ */ React__default.createElement(VStack, { className: "flex-1" }, /* @__PURE__ */ React__default.createElement(FlatList, { contentContainerStyle: {
-    flexGrow: 1,
-    paddingBottom: 50
-  }, style: {
-    width: "100%",
-    height: "100%",
-    maxWidth: "100%",
-    paddingBottom: 20,
-    marginBottom: 10
-  }, data: channels ? channels : [], keyExtractor: (item, index) => item + index, renderItem: ({
+  }, []);
+  const renderChannelItem = useCallback(({
     item
-  }) => /* @__PURE__ */ React__default.createElement(TouchableHighlight, { underlayColor: "transparent", activeOpacity: 0.5, key: item.id, style: {
-    marginTop: 1
-  }, onPress: () => openInbox(item) }, /* @__PURE__ */ React__default.createElement(Box, { className: "bg-white py-2" }, /* @__PURE__ */ React__default.createElement(VStack, { space: "md" }, /* @__PURE__ */ React__default.createElement(HStack, { className: "px-4 py-1 items-center", space: "sm" }, /* @__PURE__ */ React__default.createElement(Text, { style: styles.headingText }, item.type == RoomType.Private ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(FontAwesome, { color: "#525252", name: "lock", size: 20 })) : /* @__PURE__ */ React__default.createElement(Octicons, { color: "#525252", name: "hash", size: 20 })), /* @__PURE__ */ React__default.createElement(Box, { className: "px-2" }, /* @__PURE__ */ React__default.createElement(Text, { style: styles.headingText }, item.title)))))), ListEmptyComponent: () => {
-    return /* @__PURE__ */ React__default.createElement(Box, { className: "py-1" }, loading ? /* @__PURE__ */ React__default.createElement(Spinner, { color: colors.blue[500] }) : /* @__PURE__ */ React__default.createElement(Text, { color: colors.gray[600] }, "No Channels found"));
-  }, key: "search-channels-list" })))));
+  }) => /* @__PURE__ */ React__default.createElement(Pressable, { onPress: () => openInbox(item) }, ({
+    pressed
+  }) => /* @__PURE__ */ React__default.createElement(Box, { className: `py-4 ${pressed ? "bg-gray-100" : "bg-white"} border-b border-gray-200`, style: {
+    borderBottomColor: colors.gray[300]
+  } }, /* @__PURE__ */ React__default.createElement(HStack, { className: "px-4 items-center" }, /* @__PURE__ */ React__default.createElement(Box, { className: "mr-2" }, renderChannelIcon(item.type)), /* @__PURE__ */ React__default.createElement(VStack, null, /* @__PURE__ */ React__default.createElement(Text, { className: "font-medium text-lg text-gray-900", numberOfLines: 1, ellipsizeMode: "tail" }, item.title))))), [openInbox, renderChannelIcon]);
+  const renderEmptyList = useCallback(() => /* @__PURE__ */ React__default.createElement(Center, { className: "flex-1 py-10" }, loading ? /* @__PURE__ */ React__default.createElement(VStack, { className: "space-y-3 items-center" }, /* @__PURE__ */ React__default.createElement(Spinner, { size: "large", color: colors.blue[500] }), /* @__PURE__ */ React__default.createElement(Text, { color: colors.gray[600] }, "Loading channels...")) : /* @__PURE__ */ React__default.createElement(VStack, { className: "space-y-3 items-center px-4" }, /* @__PURE__ */ React__default.createElement(Box, { className: "rounded-full bg-gray-100 p-4" }, /* @__PURE__ */ React__default.createElement(Octicons, { name: "hash", size: 32, color: colors.gray[400] })), /* @__PURE__ */ React__default.createElement(Heading, { size: "sm", style: {
+    color: colors.gray[800]
+  } }, "No Channels Found"), searchQuery ? /* @__PURE__ */ React__default.createElement(Text, { className: "text-center", style: {
+    color: colors.gray[600]
+  } }, 'No channels match your search "', searchQuery, '"') : /* @__PURE__ */ React__default.createElement(Text, { className: "text-center", style: {
+    color: colors.gray[600]
+  } }, "Create a new channel to get started"), /* @__PURE__ */ React__default.createElement(Button, { onPress: () => navigation.navigate(NavigationRoutes.AddChannel, {
+    orgName
+  }), className: "mt-2" }, /* @__PURE__ */ React__default.createElement(ButtonText, null, "Create Channel")))), [loading, searchQuery, navigation, orgName]);
+  const keyExtractor = useCallback((item) => item.id.toString(), []);
+  useCallback(() => {
+    navigation.navigate(NavigationRoutes.AddChannel, {
+      orgName
+    });
+  }, [navigation, orgName]);
+  return /* @__PURE__ */ React__default.createElement(SafeAreaView, { style: styles.safeArea }, /* @__PURE__ */ React__default.createElement(StatusBar, { style: "dark" }), /* @__PURE__ */ React__default.createElement(Box, { className: "flex-1 bg-white" }, /* @__PURE__ */ React__default.createElement(Box, { className: "px-4 py-2", style: styles.searchContainer }, /* @__PURE__ */ React__default.createElement(Input, { variant: "outline", className: "bg-white rounded-3xl border border-gray-300", style: styles.searchInput, size: "lg" }, /* @__PURE__ */ React__default.createElement(InputSlot, { className: "pl-3" }, /* @__PURE__ */ React__default.createElement(InputIcon, { color: colors.gray[500], as: SearchIcon })), /* @__PURE__ */ React__default.createElement(InputField, { type: "text", size: "md", placeholder: "Search channels", placeholderTextColor: colors.gray[400], className: "px-3 py-2 text-base", value: searchQuery, onChangeText: searchChannels, autoCapitalize: "none", autoCorrect: false, clearButtonMode: "while-editing" }))), /* @__PURE__ */ React__default.createElement(Box, { className: "flex-1" }, /* @__PURE__ */ React__default.createElement(FlatList, { contentContainerStyle: styles.flatListContent, data: channels, keyExtractor, renderItem: renderChannelItem, ListEmptyComponent: renderEmptyList, showsVerticalScrollIndicator: false, initialNumToRender: 10, maxToRenderPerBatch: 10, windowSize: 10 }))));
 };
 const styles = StyleSheet.create({
-  container: {
+  safeArea: {
     flex: 1,
-    padding: 20
+    backgroundColor: "white"
+  },
+  searchContainer: {
+    paddingVertical: 10
   },
-  itemView: {
-    paddingVertical: 8,
-    marginTop: 5
+  searchInput: {
+    borderRadius: 10,
+    borderColor: colors.gray[300],
+    paddingHorizontal: 10
   },
-  headingText: {
-    color: Colors.light.text,
+  flatListContent: {
+    flexGrow: 1,
+    paddingBottom: 80
+  },
+  channelTitle: {
+    color: colors.gray[900],
     fontSize: 16,
-    fontWeight: "400"
+    fontWeight: "500"
+  },
+  channelDescription: {
+    color: colors.gray[600],
+    fontSize: 14,
+    marginTop: 2
   }
 });
 var Channels$1 = React__default.memo(Channels);export{Channels$1 as default};//# sourceMappingURL=Channels.js.map

package/lib/screens/Channels/Channels.js.map

@@ -1 +1 @@
-{"version":3,"file":"Channels.js","sources":["../../../src/screens/Channels/Channels.tsx"],"sourcesContent":["import React, { useState, useEffect, useLayoutEffect } from 'react';\nimport { StyleSheet, TouchableHighlight, Dimensions, SafeAreaView } from 'react-native';\nimport {\n    Input,\n    InputField,\n    InputSlot,\n    InputIcon,\n    SearchIcon,\n    Button,\n    ButtonText,\n    View,\n    Text,\n    VStack,\n    Box,\n    Fab,\n    FlatList,\n    Divider,\n    HStack,\n    SectionList,\n    Center,\n    Heading,\n    Spinner,\n} from '@admin-layout/gluestack-ui-mobile';\nimport Colors from '../../constants/Colors';\nimport { NavigationRoutes } from '../../constants/routes';\nimport { AntDesign } from '@expo/vector-icons';\n// import VirtualizedScrollView from '../VirtualizedScrollView';\nimport { RoomType } from 'common';\nimport { useGetChannelsByUserQuery, useGetChannelsByUserLazyQuery } from 'common/graphql';\nimport { useIsFocused, useFocusEffect, useNavigation } from '@react-navigation/native';\n// import { navigationRef } from '@common-stack/client-react';\nimport { FontAwesome, Feather, Octicons, MaterialIcons } from '@expo/vector-icons';\nimport colors from 'tailwindcss/colors';\nimport { StatusBar } from 'expo-status-bar';\nimport { NavigationHeader, ChannelsByAlphabeticalAccordion } from '../../components';\nimport { useDrawerLayout } from '../../hooks';\nimport { startCase, orderBy, uniqBy } from 'lodash-es';\n\nconst windowWidth = Dimensions.get('window').width;\nconst windowHeight = Dimensions.get('window').height;\n\nconst defaultChannelType = [RoomType.Channel, RoomType.Private, RoomType.Public];\n\nconst Channels = ({ navigation, route }: any) => {\n    const { orgName, organizationDetail } = useDrawerLayout();\n    const navigationRef = useNavigation<any>();\n    const isFocused = useIsFocused();\n    const [channels, setChannels] = useState<any[]>([]);\n    const [intialChannels, setInitialChannels] = useState<any[]>([]);\n\n    const {\n        data: channelsData,\n        loading,\n        error,\n        refetch,\n    } = useGetChannelsByUserQuery({\n        variables: {\n            criteria: {\n                orgName: orgName,\n                type: defaultChannelType,\n                team: null,\n            },\n            limit: 50,\n        },\n    });\n\n    useFocusEffect(\n        React.useCallback(() => {\n            if (orgName) {\n                refetch({\n                    criteria: {\n                        orgName: orgName,\n                        type: defaultChannelType,\n                        team: null,\n                    },\n                    limit: 50,\n                });\n            }\n            return () => {\n                // Do something when the screen is unfocused\n                // Useful for cleanup functions\n            };\n        }, [orgName]),\n    );\n\n    useEffect(() => {\n        if (channelsData) {\n            let channels: any = channelsData?.channelsByUser?.filter((i: any) => i.type !== RoomType.Direct);\n            channels = channels?.slice()?.sort((a: any, b: any) => a.title.localeCompare(b.title)) ?? [];\n            setChannels((oldChannels: any) => uniqBy([...channels, ...oldChannels], ({ id }) => id));\n            setInitialChannels((oldChannels: any) => uniqBy([...channels, ...oldChannels], ({ id }) => id));\n        }\n    }, [channelsData]);\n\n    useEffect(() => {\n        if (navigation)\n            navigation.setOptions({\n                // headerShown: true,\n                headerTitleAlign: 'left',\n                headerTitleStyle: {\n                    borderBottomWidth: 1,\n                },\n                headerLeft: (props: any) => (\n                    <Button onPress={() => navigation.goBack()} variant={'link'}>\n                        <ButtonText>Cancel</ButtonText>\n                    </Button>\n                ),\n                headerRight: (props: any) => (\n                    <Button\n                        onPress={() => navigation.navigate(NavigationRoutes.AddChannel, { orgName })}\n                        variant={'link'}\n                    >\n                        <ButtonText>Create</ButtonText>\n                    </Button>\n                ),\n                headerTitle: (props: any) => (\n                    <Box>\n                        <Text color={colors.black} className=\"text-[15] font-bold\">\n                            Channels\n                        </Text>\n                    </Box>\n                ),\n                headerStyle: {\n                    borderBottomWidth: 1,\n                    borderColor: '#d1d2d3',\n                },\n            });\n    }, [channels, navigation]);\n\n    const openInbox = (item: any) => {\n        navigation.navigate(NavigationRoutes.DialogMessages, {\n            channelId: item?.id?.toString(),\n            title: item?.title?.toString(),\n            totalMembers: item?.members?.length,\n            hideTabBar: true,\n        });\n    };\n\n    // const renderUserChannelItem = ({ item }: any) => {\n    //     return (\n    //         <TouchableHighlight\n    //             underlayColor={'transparent'}\n    //             activeOpacity={0.5}\n    //             key={item.id}\n    //             style={{ marginTop: 1 }}\n    //             onPress={() => openInbox(item?.id, item?.title, item?.members?.length)}\n    //         >\n    //             <Box bg={'#fff'} shadow={1} py={2}>\n    //                 <VStack space=\"5\">\n    //                     {/* <Box px=\"4\" pt=\"4\"> */}\n    //                     <HStack px=\"4\" py={1} space={2}>\n    //                         <Text style={styles.headingText}>#</Text>\n    //                         {/* <Box px=\"4\" py={1}> */}\n    //                         <Box px=\"2\">\n    //                             <Text style={styles.headingText}>{item.title}</Text>\n    //                             <Text>You are a memeber</Text>\n    //                         </Box>\n    //                     </HStack>\n    //                     {/* <Box px=\"4\" py={1}>\n    //                   <Text style={styles.headingText}>#  {item.title}</Text>\n    //                   <Text > You are a memeber</Text>\n    //               </Box> */}\n    //                     {/* <Box px=\"4\" pb={2}>\n    //                   You are a memeber\n    //               </Box> */}\n    //                 </VStack>\n    //             </Box>\n    //         </TouchableHighlight>\n    //     );\n    // };\n\n    const sortedChannels: any = React.useMemo(() => {\n        const obj = channels.reduce((r, { id, title, type, members }) => {\n            const l = title[0];\n            if (!r[l]) r[l] = [{ id, title, type, members }];\n            else r[l].push({ id, title, type, members });\n            return r;\n        }, {});\n\n        const sorted = Object.entries(obj).sort(([a], [b]) => a.localeCompare(b));\n\n        const sortedFilteredData = sorted.map(([key, value]) => {\n            return {\n                title: key,\n                data: value,\n            };\n        });\n\n        return sortedFilteredData;\n    }, [channels]);\n\n    const searchChannels = React.useCallback(\n        (v: any) => {\n            if (v) {\n                const searchedChannel = channels.filter((o: any) => o?.title?.toLowerCase().includes(v?.toLowerCase()));\n                setChannels(searchedChannel);\n            } else {\n                setChannels(intialChannels);\n            }\n        },\n        [intialChannels, channels],\n    );\n\n    return (\n        <SafeAreaView style={{ flex: 1, backgroundColor: 'white' }}>\n            <Box className=\"flex-1 bg-white\">\n                <Input\n                    style={{ boxShadow: 'none' }}\n                    variant=\"outline\"\n                    className=\"bg-gray-100 mx-4 my-2 rounded-lg border-0\"\n                >\n                    <InputSlot className=\"pl-3\">\n                        <InputIcon color={colors.black} as={SearchIcon} />\n                    </InputSlot>\n                    <InputField\n                        type=\"text\"\n                        size=\"xl\"\n                        placeholder=\"Search\"\n                        placeholderTextColor={'#404040'}\n                        className=\"px-3 items-center font-[15] color-black\"\n                        onChange={({ nativeEvent: { eventCount, target, text } }) => {\n                            searchChannels(text);\n                        }}\n                        autoCapitalize={'none'}\n                        autoCorrect={false}\n                    />\n                </Input>\n                <Divider />\n                {/* <ChannelsByAlphabeticalAccordion channels={sortedChannels} loading={loading} onPress={openInbox} /> */}\n                <Box className=\"flex-1\">\n                    <VStack className=\"flex-1\">\n                        <FlatList\n                            contentContainerStyle={{\n                                flexGrow: 1,\n                                paddingBottom: 50,\n                            }}\n                            style={{\n                                width: '100%',\n                                height: '100%',\n                                maxWidth: '100%',\n                                paddingBottom: 20,\n                                marginBottom: 10,\n                            }}\n                            data={channels ? channels : []}\n                            keyExtractor={(item: any, index: any) => item + index}\n                            renderItem={({ item }: any) => (\n                                <TouchableHighlight\n                                    underlayColor={'transparent'}\n                                    activeOpacity={0.5}\n                                    key={item.id}\n                                    style={{ marginTop: 1 }}\n                                    onPress={() => openInbox(item)}\n                                >\n                                    <Box className=\"bg-white py-2\">\n                                        <VStack space=\"md\">\n                                            <HStack className=\"px-4 py-1 items-center\" space={'sm'}>\n                                                <Text style={styles.headingText}>\n                                                    {item.type == RoomType.Private ? (\n                                                        <>\n                                                            <FontAwesome color={'#525252'} name=\"lock\" size={20} />\n                                                        </>\n                                                    ) : (\n                                                        <Octicons color=\"#525252\" name=\"hash\" size={20} />\n                                                    )}\n                                                </Text>\n\n                                                <Box className=\"px-2\">\n                                                    <Text style={styles.headingText}>{item.title}</Text>\n                                                    {/* <Text>You are a memeber</Text> */}\n                                                </Box>\n                                            </HStack>\n                                        </VStack>\n                                    </Box>\n                                </TouchableHighlight>\n                            )}\n                            ListEmptyComponent={() => {\n                                return (\n                                    <Box className=\"py-1\">\n                                        {loading ? (\n                                            <Spinner color={colors.blue[500]} />\n                                        ) : (\n                                            <Text color={colors.gray[600]}>No Channels found</Text>\n                                        )}\n                                    </Box>\n                                );\n                            }}\n                            key={'search-channels-list'}\n                        />\n                    </VStack>\n                </Box>\n\n                {/* <Fab\n                    onPress={() => navigation.navigate(NavigationRoutes.AddChannel)}\n                    bg={'$white'}\n                    $pressed-bg={'$trueGray200'}\n                    $active-bg={'$trueGray200'}\n                    bottom={'$10'}\n                    // renderInPortal={false}\n                    // shadow={3}\n                    size=\"sm\"\n                    borderRadius={'$lg'}\n                >\n                    <AntDesign color=\"black\" name=\"plus\" size={20} />\n                </Fab> */}\n            </Box>\n        </SafeAreaView>\n    );\n};\n\nconst styles = StyleSheet.create({\n    container: {\n        flex: 1,\n        //justifyContent: 'center',\n        padding: 20,\n    },\n    itemView: {\n        paddingVertical: 8,\n        marginTop: 5,\n    },\n    headingText: {\n        color: Colors.light.text,\n        fontSize: 16,\n        fontWeight: '400',\n    },\n});\n\nexport default React.memo(Channels);\n"],"names":["React","channels"],"mappings":"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"}
+{"version":3,"file":"Channels.js","sources":["../../../src/screens/Channels/Channels.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback, useMemo } from 'react';\nimport { StyleSheet, TouchableHighlight, Dimensions, SafeAreaView } from 'react-native';\nimport {\n    Input,\n    InputField,\n    InputSlot,\n    InputIcon,\n    SearchIcon,\n    Button,\n    ButtonText,\n    View,\n    Text,\n    VStack,\n    Box,\n    Fab,\n    FlatList,\n    Divider,\n    HStack,\n    SectionList,\n    Center,\n    Heading,\n    Spinner,\n    Avatar,\n    Badge,\n    BadgeText,\n    Pressable,\n} from '@admin-layout/gluestack-ui-mobile';\nimport Colors from '../../constants/Colors';\nimport { NavigationRoutes } from '../../constants/routes';\nimport { AntDesign } from '@expo/vector-icons';\n// import VirtualizedScrollView from '../VirtualizedScrollView';\nimport { RoomType } from 'common';\nimport { useGetChannelsByUserQuery } from 'common/graphql';\nimport { useIsFocused, useFocusEffect, useNavigation } from '@react-navigation/native';\n// import { navigationRef } from '@common-stack/client-react';\nimport { FontAwesome, Feather, Octicons, MaterialIcons } from '@expo/vector-icons';\nimport colors from 'tailwindcss/colors';\nimport { StatusBar } from 'expo-status-bar';\nimport { NavigationHeader, ChannelsByAlphabeticalAccordion } from '../../components';\nimport { useDrawerLayout } from '../../hooks';\nimport { startCase, orderBy, uniqBy } from 'lodash-es';\n\nconst windowWidth = Dimensions.get('window').width;\nconst windowHeight = Dimensions.get('window').height;\n\nconst defaultChannelType = [RoomType.Channel, RoomType.Private, RoomType.Public];\n\nconst Channels = ({ navigation, route }: any) => {\n    const { orgName } = useDrawerLayout();\n    const isFocused = useIsFocused();\n    const [channels, setChannels] = useState<any[]>([]);\n    const [intialChannels, setInitialChannels] = useState<any[]>([]);\n    const [searchQuery, setSearchQuery] = useState<string>('');\n\n    const {\n        data: channelsData,\n        loading,\n        error,\n        refetch,\n    } = useGetChannelsByUserQuery({\n        variables: {\n            criteria: {\n                orgName: orgName,\n                type: defaultChannelType,\n                team: null,\n            },\n            limit: 50,\n        },\n        skip: !orgName,\n    });\n\n    useFocusEffect(\n        useCallback(() => {\n            if (orgName) {\n                refetch({\n                    criteria: {\n                        orgName: orgName,\n                        type: defaultChannelType,\n                        team: null,\n                    },\n                    limit: 50,\n                });\n            }\n            return () => {\n                // Cleanup\n            };\n        }, [orgName, refetch]),\n    );\n\n    useEffect(() => {\n        if (channelsData) {\n            const newChannels =\n                channelsData?.channelsByUser\n                    ?.filter((i: any) => i.type !== RoomType.Direct)\n                    ?.sort((a: any, b: any) => a.title.localeCompare(b.title)) || [];\n\n            setChannels((oldChannels: any) => uniqBy([...newChannels, ...oldChannels], ({ id }) => id));\n            setInitialChannels((oldChannels: any) => uniqBy([...newChannels, ...oldChannels], ({ id }) => id));\n        }\n    }, [channelsData]);\n\n    useEffect(() => {\n        if (navigation) {\n            navigation.setOptions({\n                headerTitleAlign: 'left',\n                headerTitleStyle: {\n                    borderBottomWidth: 1,\n                },\n                headerLeft: () => (\n                    <Button onPress={() => navigation.goBack()} variant={'link'}>\n                        <ButtonText>\n                            <MaterialIcons name=\"close\" size={24} color=\"black\" />\n                        </ButtonText>\n                    </Button>\n                ),\n                headerRight: () => (\n                    <Button\n                        onPress={() => navigation.navigate(NavigationRoutes.AddChannel, { orgName })}\n                        variant={'link'}\n                    >\n                        <ButtonText>Create</ButtonText>\n                    </Button>\n                ),\n                // headerLeft:()=><></>,\n                // headerRight: () => (\n                //     <Button onPress={() => navigation.goBack()} variant={'link'}>\n                //         <ButtonText><MaterialIcons name=\"close\" size={24} color=\"black\" /></ButtonText>\n                //     </Button>\n                // ),\n                headerTitle: () => (\n                    <Box>\n                        <Text color={colors.black} className=\"text-[15] font-bold\">\n                            Channels\n                        </Text>\n                    </Box>\n                ),\n                headerStyle: {\n                    borderBottomWidth: 1,\n                    borderColor: '#d1d2d3',\n                },\n            });\n        }\n    }, [navigation, orgName]);\n\n    const openInbox = useCallback(\n        (item: any) => {\n            navigation.navigate(NavigationRoutes.DialogMessages, {\n                channelId: item?.id?.toString(),\n                title: item?.title?.toString(),\n                totalMembers: item?.members?.length,\n                hideTabBar: true,\n            });\n        },\n        [navigation],\n    );\n\n    const searchChannels = useCallback(\n        (text: string) => {\n            setSearchQuery(text);\n            if (text) {\n                const searchedChannel = intialChannels.filter((o: any) =>\n                    o?.title?.toLowerCase().includes(text?.toLowerCase()),\n                );\n                setChannels(searchedChannel);\n            } else {\n                setChannels(intialChannels);\n            }\n        },\n        [intialChannels],\n    );\n\n    const renderChannelIcon = useCallback((type: RoomType) => {\n        if (type === RoomType.Private) {\n            return <FontAwesome color={'#525252'} name=\"lock\" size={18} />;\n        } else {\n            return <Octicons color=\"#525252\" name=\"hash\" size={18} />;\n        }\n    }, []);\n\n    const renderChannelItem = useCallback(\n        ({ item }: any) => (\n            <Pressable onPress={() => openInbox(item)}>\n                {({ pressed }) => (\n                    <Box\n                        className={`py-4 ${pressed ? 'bg-gray-100' : 'bg-white'} border-b border-gray-200`}\n                        style={{ borderBottomColor: colors.gray[300] }}\n                    >\n                        <HStack className=\"px-4 items-center\">\n                            <Box className=\"mr-2\">{renderChannelIcon(item.type)}</Box>\n                            <VStack>\n                                <Text\n                                    className=\"font-medium text-lg text-gray-900\"\n                                    numberOfLines={1}\n                                    ellipsizeMode=\"tail\"\n                                >\n                                    {item.title}\n                                </Text>\n                            </VStack>\n                        </HStack>\n                    </Box>\n                )}\n            </Pressable>\n        ),\n        [openInbox, renderChannelIcon],\n    );\n\n    const renderEmptyList = useCallback(\n        () => (\n            <Center className=\"flex-1 py-10\">\n                {loading ? (\n                    <VStack className=\"space-y-3 items-center\">\n                        <Spinner size=\"large\" color={colors.blue[500]} />\n                        <Text color={colors.gray[600]}>Loading channels...</Text>\n                    </VStack>\n                ) : (\n                    <VStack className=\"space-y-3 items-center px-4\">\n                        <Box className=\"rounded-full bg-gray-100 p-4\">\n                            <Octicons name=\"hash\" size={32} color={colors.gray[400]} />\n                        </Box>\n                        <Heading size=\"sm\" style={{ color: colors.gray[800] }}>\n                            No Channels Found\n                        </Heading>\n                        {searchQuery ? (\n                            <Text className=\"text-center\" style={{ color: colors.gray[600] }}>\n                                No channels match your search \"{searchQuery}\"\n                            </Text>\n                        ) : (\n                            <Text className=\"text-center\" style={{ color: colors.gray[600] }}>\n                                Create a new channel to get started\n                            </Text>\n                        )}\n                        <Button\n                            onPress={() => navigation.navigate(NavigationRoutes.AddChannel, { orgName })}\n                            className=\"mt-2\"\n                        >\n                            <ButtonText>Create Channel</ButtonText>\n                        </Button>\n                    </VStack>\n                )}\n            </Center>\n        ),\n        [loading, searchQuery, navigation, orgName],\n    );\n\n    const keyExtractor = useCallback((item: any) => item.id.toString(), []);\n\n    const navigateToAddChannel = useCallback(() => {\n        navigation.navigate(NavigationRoutes.AddChannel, { orgName });\n    }, [navigation, orgName]);\n\n    return (\n        <SafeAreaView style={styles.safeArea}>\n            <StatusBar style=\"dark\" />\n            <Box className=\"flex-1 bg-white\">\n                <Box className=\"px-4 py-2\" style={styles.searchContainer}>\n                    <Input\n                        variant=\"outline\"\n                        className=\"bg-white rounded-3xl border border-gray-300\"\n                        style={styles.searchInput}\n                        size=\"lg\"\n                    >\n                        <InputSlot className=\"pl-3\">\n                            <InputIcon color={colors.gray[500]} as={SearchIcon} />\n                        </InputSlot>\n                        <InputField\n                            type=\"text\"\n                            size=\"md\"\n                            placeholder=\"Search channels\"\n                            placeholderTextColor={colors.gray[400]}\n                            className=\"px-3 py-2 text-base\"\n                            value={searchQuery}\n                            onChangeText={searchChannels}\n                            autoCapitalize=\"none\"\n                            autoCorrect={false}\n                            clearButtonMode=\"while-editing\"\n                        />\n                    </Input>\n                </Box>\n\n                <Box className=\"flex-1\">\n                    <FlatList\n                        contentContainerStyle={styles.flatListContent}\n                        data={channels}\n                        keyExtractor={keyExtractor}\n                        renderItem={renderChannelItem}\n                        ListEmptyComponent={renderEmptyList}\n                        showsVerticalScrollIndicator={false}\n                        initialNumToRender={10}\n                        maxToRenderPerBatch={10}\n                        windowSize={10}\n                    />\n                </Box>\n\n                {/* <Fab\n                    onPress={navigateToAddChannel}\n                    className=\"bg-blue-500 mb-16 mr-4\"\n                    $pressed-className=\"bg-blue-600\"\n                    size=\"lg\"\n                    placement=\"bottom right\"\n                >\n                    <AntDesign color=\"white\" name=\"plus\" size={24} />\n                </Fab> */}\n            </Box>\n        </SafeAreaView>\n    );\n};\n\nconst styles = StyleSheet.create({\n    safeArea: {\n        flex: 1,\n        backgroundColor: 'white',\n    },\n    searchContainer: {\n        paddingVertical: 10,\n    },\n    searchInput: {\n        borderRadius: 10,\n        borderColor: colors.gray[300],\n        paddingHorizontal: 10,\n    },\n    flatListContent: {\n        flexGrow: 1,\n        paddingBottom: 80,\n    },\n    channelTitle: {\n        color: colors.gray[900],\n        fontSize: 16,\n        fontWeight: '500',\n    },\n    channelDescription: {\n        color: colors.gray[600],\n        fontSize: 14,\n        marginTop: 2,\n    },\n});\n\nexport default React.memo(Channels);\n"],"names":["React"],"mappings":"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"}