Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import React, { useState } from 'react'
import styled from 'styled-components'
import { addNotification } from '../../../redux/notification/notification.actions'
import Spinner from '../../../shared/loading-spinner/Spinner'
import { axios } from '../../../utils'

const StyledSpinnerContainer = styled.div`
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.4);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 300;
`

export default function SocialNetworks ({ className = 'peopleYouMayKnow' }) {
  const [loading, setLoading] = useState(false)
  const handleOnRoom = async () => {
    try {
      setLoading(true)
      const response = await axios.post('/moodle')
      if (response.data.success) {
        const form = document.createElement('form')
        form.setAttribute('method', 'post')
        form.setAttribute('action', response.data.data.url)
        form.setAttribute('target', '_blank')
        Object.keys(response.data.data).forEach(key => {
          if (key !== 'url') {
            const value = response.data.data[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: 'Ha ocurrido un error en la comunicacion con ON ROOM'
      })
    } finally {
      setLoading(false)
    }
  }
  return (
        <div className={className}>
            <div className='widget__app'>
                <a href="#" onClick={() => handleOnRoom()}>
                    <img
                        className='widget__app__img'
                        src="/images/logo-onroom.png"
                        alt=""
                    />
                </a>
                <a href="#" onClick={() => handleOnRoom()} className={'widget__app__title'} title="">
                    CESA ON ROOM
                </a>
            </div>
            <div className='widget__app'>
                <div className="d-flex" style={{ gap: '5px' }}>
                    <a
                        href='https://play.google.com/store/apps/details?id=com.cesams.twogetskills'
                        target="_blank" rel="noreferrer"
                    >
                        <img
                            className='widget__app__img'
                            src="/images/logo-2getskills-android.jpeg"
                            alt=""
                        />
                    </a>
                    <a
                        href='https://apps.apple.com/us/app/2getskills/id1575789638'
                        target="_blank" rel="noreferrer"
                    >
                        <img
                            className='widget__app__img'
                            src="/images/logo-2getskillsa-apple.jpeg"
                            alt=""
                        />
                    </a>
                </div>
                <a href="#" className='widget__app__title' title="">
                    {LABELS.MICRO_LEARNING}
                </a>
            </div>
            {loading &&
                <StyledSpinnerContainer>
                    <Spinner />
                </StyledSpinnerContainer>
            }
        </div>
  )
}