Proyectos de Subversion LeadersLinked - Antes de SPA

import React from "react";
import { connect } from "react-redux";
import { openShareModal } from "../../../redux/share-modal/shareModal.actions";
import { shareModalTypes } from "../../../redux/share-modal/shareModal.types";

import styles from "./shareFeed.module.scss";

const ShareFeed = (props) => {
  // Reduce destructuring
  const { openShareModal, feedType, postUrl } = props;

  const onClickHandler = (event, postType) => {
    event.preventDefault();
    openShareModal(postUrl, postType, feedType);
  };
  
  return (
    <div className={styles.shareFeed}>
      <div id="publica-feed" className="">
        <div className="post-bar">
          <form id="form-main" name="form-main">
            <div className="share_feed_post_topbar">
              <div className="mar-top clearfix">
                <div className="form-group"></div>
                <div className="form-group">
                  <textarea
                    id="description-main"
                    name="description-main"
                    placeholder="Publica contenido para intercambiar con tus contactos"
                    className="form-control"
                    readOnly
                    rows="2"
                    onClick={(e) => onClickHandler(e, shareModalTypes.POST)}
                    style={{
                      resize: "none",
                    }}
                  ></textarea>
                </div>
              </div>

              <div className="mar-top clearfix">
                <div
                  className="row"
                >
                  <div
                    className="col-md-8 col-sm-8"
                  >
                    <div
                      className="row"
                    >
                      <div
                        className="col-md-4 col-sm-4 col-4 p-1"
                        style={{
                          overflow: 'hidden',
                          whiteSpace: 'nowrap',
                          textOverflow: 'ellipsis'
                        }}
                      >
                        <a
                          className={"btn btn-trans p-0 btn-icon add-tooltip " + styles.shareIconContainer}
                          href="#"
                          onClick={(e) => onClickHandler(e, shareModalTypes.VIDEO)}
                        >
                          <img
                            src="/images/video-icon.png"
                            className={styles.shareIcon}
                          />
                          <span
                            className="ellipsis d-none d-sm-block d-md-block d-lg-block"
                          >
                            Videos
                          </span>
                        </a>
                      </div>
                      <div
                        className="col-md-4 col-sm-4 col-4 p-1"
                        style={{
                          overflow: 'hidden',
                          whiteSpace: 'nowrap',
                          textOverflow: 'ellipsis'
                        }}
                      >
                        <a
                          className={"btn btn-trans p-0 btn-icon add-tooltip " + styles.shareIconContainer}
                          href="#"
                          onClick={(e) => onClickHandler(e, shareModalTypes.IMAGE)}
                        >
                          <img
                            src="/images/image-icon.jpeg"
                            className={styles.shareIcon}
                          />
                          <span
                            className="ellipsis d-none d-sm-block d-md-block d-lg-block"
                          >
                            Imagen
                          </span>
                        </a>
                      </div>
                      <div
                        className="col-md-4 col-sm-4 col-4 p-1"
                        style={{
                          whiteSpace: 'nowrap',
                          textOverflow: 'ellipsis'
                        }}
                      >
                        <a
                          className={"btn btn-trans p-0 btn-icon add-tooltip " + styles.shareIconContainer}
                          href="#"
                          onClick={(e) => onClickHandler(e, shareModalTypes.FILE)}
                        >
                          <img
                            src="/images/document-icon.jpeg"
                            className={styles.shareIcon}
                          />
                          <span
                            className="ellipsis d-none d-sm-block d-md-block d-lg-block"
                          >
                            Documentos
                          </span>
                        </a>
                      </div>
                    </div>
                  </div>
                  <div
                    className="col-md-4 col-sm-4  text-center"
                  >
                    <button
                      className="btn btn-sm btn-primary" 
                      type="button"
                      id="btn-description-main"
                      onClick={(e) => onClickHandler(e, shareModalTypes.POST)}
                    >
                      Compartir
                    </button>
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  );
};

// const mapStateToProps = (state) => ({});

const mapDispatchToProps = {
  openShareModal: (postUrl, modalType, feedType) =>
    openShareModal(postUrl, modalType, feedType),
};

export default connect(null, mapDispatchToProps)(ShareFeed);