All files / atlas-mobile-ts/src/components/Map/Panels/FilterPanel FilterLmTypes.tsx

0% Statements 0/9
100% Branches 0/0
0% Functions 0/3
0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44                                                                                       
/* Copyright (C) Click & Push Accessibility, Inc - All Rights Reserved
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * Proprietary and confidential
 * Written and maintained by the Click & Push Development team 
 * <dev@clicknpush.ca>, January 2022
 */
 
import React from "react"
import { View, Text } from "react-native"
import Select from "react-native-multiple-select"
import { lmTypes } from "../../../../utils/GlobalUtils"
 
interface FilterLmTypesProps {
    localFilterTypes: number[],
    setLocalFilterTypes: (types: number[]) => void
}
 
/**
 * Component that offers a selector for landmark types to be filtered
 */
export const FilterLmTypes: React.FC<FilterLmTypesProps> = ({setLocalFilterTypes, localFilterTypes}) => {
    return (
        <View style={{marginBottom: 10, justifyContent: 'flex-start'}}>
            <Text style={{marginRight: 10, marginBottom: 5}}>Landmark type:</Text>
            <View style={{width: '100%', justifyContent: 'center'}}>
                <Select
                    textColor='black'  
                    itemTextColor='black'
                    displayKey="label"
                    uniqueKey="value"
                    submitButtonText="Confirm"
                    submitButtonColor='black'
                    onSelectedItemsChange={(types) => {
                        setLocalFilterTypes(types)
                    }}
                    selectedItems={localFilterTypes}
                    items={Object.keys(lmTypes)?.map(icon => {
                        return (
                            {label: lmTypes[parseInt(icon)].label.toUpperCase(), value: parseInt(icon), key: icon}
                        )})} />
            </View>
        </View> 
    )
}