Skip to content

Commit

Permalink
feat: relocate Icon atom from WEB
Browse files Browse the repository at this point in the history
  • Loading branch information
Uzhastin-Nikita authored and the-homeless-god committed May 26, 2022
1 parent c7e0de4 commit b4d73e2
Show file tree
Hide file tree
Showing 6 changed files with 174 additions and 0 deletions.
22 changes: 22 additions & 0 deletions src/components/atoms/Icon/Icon.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import React from 'react'

import { Icons } from 'src/components/atoms/Icon/Icon.types'

import { getIcon } from 'src/components/atoms/Icon/Icon.utils'

export type IconProps = {
name: Icons | string
tooltip?: string
onClick?: () => void
className?: string
}

export const Icon = ({ name, onClick, className, tooltip }: IconProps) => {
const IconComponent = getIcon(name)

return (
<div className={className} onClick={onClick} title={tooltip}>
<IconComponent />
</div>
)
}
37 changes: 37 additions & 0 deletions src/components/atoms/Icon/Icon.types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
export enum Icons {
// social
telegram = 'telegram',
facebook = 'facebook',
vkontakte = 'vkontakte',
twitter = 'twitter',
github = 'github',

// common
gamepad = 'gamepad',
work = 'work',
house = 'house',
star = 'star',
domain = 'domain',
graphics = 'graphics',

// details
processor = 'processor',
motherboard = 'motherboard',
videocard = 'videocard',
ram = 'ram',
close = 'close',

// navLinks
call = 'call',
catalog = 'catalog',
delivery = 'delivery',
home = 'home',

// benefit
dollar = 'dollar',
guality = 'guality',
tool = 'tool',
modules = 'modules',
vector = 'vector',
envelope = 'envelope'
}
7 changes: 7 additions & 0 deletions src/components/atoms/Icon/Icon.utils.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { ICONS } from './Icon.utils'

describe('Icon.utils', () => {
it('should match snapshot', () => {
expect(ICONS).toMatchSnapshot()
})
})
73 changes: 73 additions & 0 deletions src/components/atoms/Icon/Icon.utils.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
// benefit
import DollarImage from '../../../../public/images/benefit/dollar.svg'
import EnvelopeImage from '../../../../public/images/benefit/envelope.svg'
import GualityImage from '../../../../public/images/benefit/guality.svg'
import ModulesImage from '../../../../public/images/benefit/modules.svg'
import ToolImage from '../../../../public/images/benefit/tool.svg'
import VectorImage from '../../../../public/images/benefit/vector.svg'

// common
import CloseImage from '../../../../public/images/common/close.svg'
import DomainImage from '../../../../public/images/common/domain.svg'
import GamepadImage from '../../../../public/images/common/gamepad.svg'
import GraphicsImage from '../../../../public/images/common/graphics.svg'

import HouseImage from '../../../../public/images/common/house.svg'
import MotherboardImage from '../../../../public/images/common/motherboard.svg'
import ProcessorImage from '../../../../public/images/common/processor.svg'
import RamImage from '../../../../public/images/common/ram.svg'
import StarImage from '../../../../public/images/common/star.svg'
import VideocardImage from '../../../../public/images/common/videocard.svg'
import WorkImage from '../../../../public/images/common/work.svg'

// navLinks
import CallImage from '../../../../public/images/navLinks/call.svg'
import CatalogImage from '../../../../public/images/navLinks/catalog.svg'
import DeliveryImage from '../../../../public/images/navLinks/delivery.svg'
import HomeImage from '../../../../public/images/navLinks/home.svg'

// social
import FacebookImage from '../../../../public/images/social/facebook.svg'
import GithubImage from '../../../../public/images/social/github.svg'
import TelegramImage from '../../../../public/images/social/telegram.svg'
import TwitterImage from '../../../../public/images/social/twitter.svg'
import VKImage from '../../../../public/images/social/vkontakte.svg'

import { Icons } from './Icon.types'

export const ICONS: Record<Icons | string, string> = {
[Icons.telegram]: TelegramImage,
[Icons.facebook]: FacebookImage,
[Icons.vkontakte]: VKImage,
[Icons.twitter]: TwitterImage,
[Icons.github]: GithubImage,
// common
[Icons.gamepad]: GamepadImage,
[Icons.work]: WorkImage,
[Icons.house]: HouseImage,
[Icons.star]: StarImage,
[Icons.domain]: DomainImage,
[Icons.graphics]: GraphicsImage,
// details
[Icons.processor]: ProcessorImage,
[Icons.motherboard]: MotherboardImage,
[Icons.videocard]: VideocardImage,
[Icons.ram]: RamImage,
[Icons.close]: CloseImage,
// navLinks
[Icons.call]: CallImage,
[Icons.catalog]: CatalogImage,
[Icons.delivery]: DeliveryImage,
[Icons.home]: HomeImage,
// benefit
[Icons.dollar]: DollarImage,
[Icons.guality]: GualityImage,
[Icons.tool]: ToolImage,
[Icons.modules]: ModulesImage,
[Icons.vector]: VectorImage,
[Icons.envelope]: EnvelopeImage
}

export const getIcon = (name: Icons | string) => {
return ICONS[name]
}
32 changes: 32 additions & 0 deletions src/components/atoms/Icon/__snapshots__/Icon.utils.test.tsx.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Icon.utils should match snapshot 1`] = `
Object {
"call": "svg",
"catalog": "svg",
"close": "svg",
"delivery": "svg",
"dollar": "svg",
"domain": "svg",
"envelope": "svg",
"facebook": "svg",
"gamepad": "svg",
"github": "svg",
"graphics": "svg",
"guality": "svg",
"home": "svg",
"house": "svg",
"modules": "svg",
"motherboard": "svg",
"processor": "svg",
"ram": "svg",
"star": "svg",
"telegram": "svg",
"tool": "svg",
"twitter": "svg",
"vector": "svg",
"videocard": "svg",
"vkontakte": "svg",
"work": "svg",
}
`;
3 changes: 3 additions & 0 deletions src/components/atoms/Icon/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export * from './Icon'
export * from './Icon.types'
export * from './Icon.utils'

0 comments on commit b4d73e2

Please sign in to comment.