diff --git a/assets/dropdown.png b/assets/dropdown.png new file mode 100644 index 00000000..a9ffc505 Binary files /dev/null and b/assets/dropdown.png differ diff --git a/assets/dropup.png b/assets/dropup.png new file mode 100644 index 00000000..ad1cc46e Binary files /dev/null and b/assets/dropup.png differ diff --git a/src/components/ToDoComponent/SettingGoals/CreateGoals.tsx b/src/components/ToDoComponent/SettingGoals/CreateGoals.tsx index 5167e37a..c7504d40 100644 --- a/src/components/ToDoComponent/SettingGoals/CreateGoals.tsx +++ b/src/components/ToDoComponent/SettingGoals/CreateGoals.tsx @@ -1,21 +1,46 @@ -import React, { useState } from 'react'; +import React, { useState,useEffect,useContext } from 'react'; import 'react-native-gesture-handler'; import { Text, TextInput, View, - ScrollView, StyleSheet, TouchableOpacity, + Image, + FlatList } from 'react-native'; import DeadLineDatePicker from './SettingGoalsComponents/DeadLineDatePicker'; +import { AuthContext } from '../../../context/AuthContext'; +import { getAllUsers } from '../../../screens/AuthScreen/Util'; const MainScreen = ({ navigation }) => { const [selectedMember, setSelectedMember] = React.useState(''); const [titleText, setTitleText] = useState(''); const [descriptionText, setDescriptionText] = useState(''); + const [isDropDownSelected, setIsDropDownSelected] =useState(false) + const [searchQuery, setSearchQuery] = useState(''); + const [allUsers,setAllUsers] = useState([]); + const [isLoading, setIsLoading] = useState(true); + const { loggedInUserData } = useContext(AuthContext); + + + + const selectDropDown =()=>{ + setIsDropDownSelected(!isDropDownSelected) + } + + useEffect(() => { + fetchData(); + }); + + const fetchData = async () => { + const allUser = await getAllUsers (loggedInUserData?.token); + setAllUsers(allUser); + setIsLoading(false) + }; + return ( - + { value={titleText} onChangeText={setTitleText} placeholder="Enter title max of 50 characters." + placeholderTextColor="red" /> Description { onChangeText={setDescriptionText} maxLength={200} placeholder="Enter max 200 characters." + placeholderTextColor="red" /> {/* Duration */} - Assigned To + Assign To {/* */} @@ -70,6 +97,62 @@ const MainScreen = ({ navigation }) => { {selectedMember ? selectedMember : "Enter member's name"} + + + + Assign To Dropdown + + + Select User + + { + !isDropDownSelected? + : + + } + + { + isDropDownSelected? + + setSearchQuery(text)} + maxLength={200} + placeholder="Search User" + /> + { + isLoading?Loading...: + + item.first_name.toLowerCase().includes(searchQuery.toLowerCase()) || + item.last_name.toLowerCase().includes(searchQuery.toLowerCase()) || + item.github_id.toLowerCase().includes(searchQuery.toLowerCase()) + )} + renderItem={({ item, index }) => { + return ( + console.log(item)} style={styles.userDetails}> + {item.picture && item.picture.url ? ( + + ) : ( + + + {item.first_name.charAt(0)} {item.last_name.charAt(0)} + + + )} + {item.first_name} {item.last_name} + + ); + }} + /> + } + + + :null + } + DeadLine { Create - + ); }; @@ -138,6 +221,53 @@ const styles = StyleSheet.create({ backgroundColor: '#2827CC', }, titleText: {}, + dropDownSelector:{ + padding: 10, + borderRadius: 5, + elevation: 2, + fontSize: 12, + borderWidth: 2, + height:40, + display:"flex", + flexDirection:"row", + justifyContent:"space-between" + }, + dropDownIcon:{ + width:20, + height:20, + }, + dropDownArea:{ + height:250, + backgroundColor:"grey", + marginTop:10, + borderRadius:5 + }, + userNameDropDown:{ + padding:20, + borderBottomColor:'white', + width:"90%",alignSelf:"center" + }, + userDetails:{ + display:"flex", + flexDirection:"row", + marginLeft:10 + }, + userImageDropDown:{ + width:50, + height:50, + borderRadius:50 + + }, + defaultImageContainer:{ + width:50, + display:"flex", + justifyContent:"center", + alignItems:"center", + height:50, + backgroundColor:"rgb(29,18,131)", + borderRadius:50 + }, + }); export default MainScreen; diff --git a/src/constants/apiConstant/HomeApi.ts b/src/constants/apiConstant/HomeApi.ts index e3773cda..35318c9c 100644 --- a/src/constants/apiConstant/HomeApi.ts +++ b/src/constants/apiConstant/HomeApi.ts @@ -1,5 +1,5 @@ export const HomeApi = { GET_USER_STATUS: 'https://api.realdevsquad.com/users/status/self', - UPDATE_STATUS: - 'https://api.realdevsquad.com/users/status/self?userStatusFlag=true', + UPDATE_STATUS:'https://api.realdevsquad.com/users/status/self?userStatusFlag=true', + GET_ALL_USERS:'https://api.realdevsquad.com/users' }; diff --git a/src/screens/AuthScreen/Util.ts b/src/screens/AuthScreen/Util.ts index ad7ca403..b0930ce4 100644 --- a/src/screens/AuthScreen/Util.ts +++ b/src/screens/AuthScreen/Util.ts @@ -98,6 +98,27 @@ export const getUsersStatus = async (token) => { } }; +export const getAllUsers = async (token) => { + try { + const res = await axios.get(HomeApi.GET_ALL_USERS, { + headers: { + 'Content-type': 'application/json', + cookie: `rds-session=${token}`, + }, + }); + if (res?.data?.users) { + return res?.data?.users; + } + else { + return 'Something went wrong'; + } + } + + catch (err) { + return 'Something went wrong'; + } +}; + export const submitOOOForm = async (data, token) => { console.log('data', data); const options = {