Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react'
import { useSelector } from 'react-redux'
import { Avatar, Box, Typography } from '@mui/material'

import { getOnRoom } from '@app/services/onRoom'
import { addNotification } from '@app/redux/notification/notification.actions'

import Spinner from '@app/components/UI/Spinner'
import WidgetWrapper from '../WidgetLayout'

const AppsWidget = ({ moodle, microlearning }) => {
  const [loading, setLoading] = useState(false)
  const labels = useSelector(({ intl }) => intl.labels)

  const handleOnRoom = async () => {
    try {
      setLoading(true)
      const response = await getOnRoom()

      const form = document.createElement('form')
      form.setAttribute('method', 'post')
      form.setAttribute('action', response.url)
      form.setAttribute('target', '_blank')
      Object.keys(response).forEach((key) => {
        if (key !== 'url') {
          const value = response[key]
          const hiddenField = document.createElement('input')
          hiddenField.setAttribute('type', 'hidden')
          hiddenField.setAttribute('name', key)
          hiddenField.setAttribute('value', value)
          form.appendChild(hiddenField)
        }
      })
      document.body.appendChild(form)
      form.submit()
    } catch (error) {
      console.log('>>: error > ', error)
      addNotification({ style: 'danger', msg: error.message })
    } finally {
      setLoading(false)
    }
  }

  return (
    <WidgetWrapper
      sx={{
        padding: 2,
        display: 'flex',
        flexDirection: 'column',
        alignItems: 'center'
      }}
    >
      {loading && <Spinner />}

      <Avatar
        sx={{ cursor: 'pointer' }}
        src={moodle.image}
        alt={moodle.name}
        onClick={() => handleOnRoom()}
      />
      <Typography variant='body2'>{moodle.name}</Typography>

      <Box
        sx={{
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
          gap: 1,
          mt: 1
        }}
      >
        <a href={microlearning.playStore} target='_blank' rel='noreferrer'>
          <Avatar src='/images/logo-2getskillsa-apple.jpeg' />
        </a>

        <a href={microlearning.appStore} target='_blank' rel='noreferrer'>
          <Avatar src='/images/logo-2getskills-android.jpeg' />
        </a>
      </Box>

      <Typography variant='body2'>{labels.microlearning}</Typography>
    </WidgetWrapper>
  )
}

export default AppsWidget