1import * as React from 'react';
2
3import { Image } from '../Image';
4import { useCurrentTheme } from '../useExpoTheme';
5
6const activeLightIcon = require('../../assets/extensions-filled-active-icon-light.png');
7const activeIcon = require('../../assets/extensions-filled-active-icon.png');
8const inactiveLightIcon = require('../../assets/extensions-filled-inactive-icon-light.png');
9const inactiveIcon = require('../../assets/extensions-filled-inactive-icon.png');
10
11const iconMap = {
12  light: {
13    active: activeIcon,
14    inactive: inactiveIcon,
15  },
16  dark: {
17    active: activeLightIcon,
18    inactive: inactiveLightIcon,
19  },
20};
21
22type TabBarIconProps = Partial<React.ComponentProps<typeof Image>> & {
23  focused?: boolean;
24};
25
26export function ExtensionsFilledIcon(props: TabBarIconProps) {
27  const theme = useCurrentTheme();
28  const themedIcon = iconMap[theme];
29  const icon = props.focused ? themedIcon.active : themedIcon.inactive;
30  return <Image source={icon} {...props} />;
31}
32