import React from 'react';
import Icon36Add from '@vkontakte/icons/dist/36/add';
import Icon28CheckShieldOutline from '@vkontakte/icons/dist/28/check_shield_outline';
import { Header, Banner, PanelHeader, Panel, Div, Text, Avatar, CellButton, View, Link, Button, HorizontalScroll, Group } from '@vkontakte/vkui';
import Icon16Fire from '@vkontakte/icons/dist/16/fire';
import "./Style.css"
import persik from '../img/n8z3D3vxjkA.jpg';

const Home = ({ id, go, fetchedUser }) => {
const [achivments,changeAchivments] = React.useState([false])
const data = {ach1:<img style={{background:'red'}}/>}

retrun (<Panel className="Notifi" id={id} >
    <PanelHeader separator={false} >
      Ачивки
    </PanelHeader>
    <img className="Persik" src={persik} alt="Persik The Cat"/>
    {achivments[0]&&achivments.map(e=>{return data[e]})}
    <button onClick={()=>{
      fetch('http://localhost:3000/user?vk_user_id=102343170')
      .then(e=>e.text())
      .then(e=>changeAchivments(e))
    }}> РаБоТаЙ </button>
  </Panel>)
};

export default Home;