kitchen-simulator 5.0.0-test.7 → 5.0.0-test.71

package/src/actions/user-actions.js

@@ -1,75 +0,0 @@
-import {
-  LOGIN_SUCCESS,
-  LOGIN_ERROR,
-  LOGOUT,
-  SET_USER_DATA,
-  LOCAL_STORAGE_TOKEN_VALUE,
-  LOCAL_STORAGE_ORIGINAL_TOKEN,
-  LOCAL_STORAGE_TOKEN_NAME
-} from '../constants';
-import jwtService from '../components/login/jwtService';
-import history from '../@history';
-import ls from 'localstorage-slim';
-
-export function submitLogin(values) {
-  jwtService
-    .signInWithEmailAndPassword(values)
-    .then(response => {
-      console.log(response);
-      if (response.data.user) {
-        setUser(response.data.user);
-        setSession(response.data.token);
-        return {
-          type: LOGIN_SUCCESS,
-          user: response.data.user
-        };
-      }
-    })
-    .catch(error => {
-      return {
-        type: LOGIN_ERROR,
-        payload: error
-      };
-    });
-}
-
-export function logout() {
-  jwtService.logout();
-  history.push({
-    pathname: '/login'
-  });
-  return {
-    type: LOGOUT
-  };
-}
-
-export function login(userid, role, token, utmObj) {
-  let projectId = sessionStorage.getItem('projectId');
-  if (projectId === null) projectId = 'new';
-  let utm = new URLSearchParams(Object.entries(utmObj));
-  const visualizerName = sessionStorage.getItem('visualizerName');
-  const originalAccessToken = ls.get(LOCAL_STORAGE_ORIGINAL_TOKEN);
-  const tokenName = ls.get(LOCAL_STORAGE_TOKEN_NAME);
-
-  let extraParams = '';
-  if (tokenName && originalAccessToken) {
-    extraParams = `&${tokenName}${originalAccessToken}`;
-  }
-
-  history.push({
-    pathname: `/${visualizerName}/project/${role}/${token}/${projectId}?${utm.toString()}${extraParams}`
-  });
-  return {
-    type: LOGIN_SUCCESS,
-    userid
-  };
-}
-
-export function setUserData(user) {
-  return dispatch => {
-    dispatch({
-      type: SET_USER_DATA,
-      payload: user
-    });
-  };
-}

package/src/components/atoms/Snackbar/index.jsx

@@ -1,43 +0,0 @@
-import React from 'react';
-import Snackbar from '@material-ui/core/Snackbar';
-import { SnackbarContent } from '@material-ui/core/index';
-import Slide from '@material-ui/core/Slide';
-import { TEXT_COLOR_NEUTRAL_0 } from '../../../constants';
-
-const SnackBar = ({
-  message,
-  isOpen = false,
-  autoHideDuration = !!autoHideDuration ? autoHideDuration : 5000,
-  action = '',
-  handleClose,
-  snackBarColor = TEXT_COLOR_NEUTRAL_0,
-  style
-}) => {
-  return (
-    <Snackbar
-      style={style}
-      open={isOpen}
-      autoHideDuration={autoHideDuration}
-      handleClose={handleClose}
-      anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
-      TransitionComponent={Slide}
-      onClose={handleClose}
-    >
-      <SnackbarContent
-        style={{ backgroundColor: snackBarColor }}
-        action={
-          action || (
-            <img
-              onClick={handleClose}
-              style={{ float: 'right', height: 24, cursor: 'pointer' }}
-              src="/assets/img/svg/close.svg"
-            />
-          )
-        }
-        message={<div dangerouslySetInnerHTML={{ __html: message }} />}
-      />
-    </Snackbar>
-  );
-};
-
-export default SnackBar;

package/src/components/atoms/radio-button/index.jsx

@@ -1,20 +0,0 @@
-import React from 'react';
-
-import { RadioWrapper } from './styles';
-
-const RadioButton = ({ label, checked = false, name, value, id, onChange }) => {
-  return (
-    <RadioWrapper onClick={() => onChange(value)}>
-      <input
-        type="radio"
-        id={id}
-        name={name}
-        defaultChecked={checked}
-        value={value}
-      />
-      <label htmlFor={id}>{label}</label>
-    </RadioWrapper>
-  );
-};
-
-export default RadioButton;

package/src/components/atoms/radio-button/styles.js

@@ -1,56 +0,0 @@
-import styled from 'styled-components';
-
-export const RadioWrapper = styled.div`
-  display: inline-block;
-  color: #fff;
-  margin-right: 10px;
-
-  [type='radio']:checked,
-  [type='radio']:not(:checked) {
-    position: absolute;
-    left: -9999px;
-  }
-  [type='radio']:checked + label,
-  [type='radio']:not(:checked) + label {
-    position: relative;
-    padding-left: 28px;
-    cursor: pointer;
-    line-height: 20px;
-    display: inline-block;
-  }
-  [type='radio']:checked + label:before,
-  [type='radio']:not(:checked) + label:before {
-    content: '';
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 18px;
-    height: 18px;
-    border: 1px solid #ddd;
-    border-radius: 100%;
-    background: #fff;
-  }
-  [type='radio']:checked + label:after,
-  [type='radio']:not(:checked) + label:after {
-    content: '';
-    width: 12px;
-    height: 12px;
-    background: #000;
-    position: absolute;
-    top: 4px;
-    left: 4px;
-    border-radius: 100%;
-    -webkit-transition: all 0.2s ease;
-    transition: all 0.2s ease;
-  }
-  [type='radio']:not(:checked) + label:after {
-    opacity: 0;
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-  [type='radio']:checked + label:after {
-    opacity: 1;
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-`;

package/src/components/button/MainButton.jsx

@@ -1,157 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import styled from 'styled-components';
-import {
-  BG_COLOR_0,
-  BG_COLOR_1,
-  BG_COLOR_HOVER,
-  DEFAULT_FONT_FAMILY,
-  PRIMARY_GREEN_COLOR,
-  SECONDARY_PURPLE_COLOR,
-  SHADE_DARK_GREEN_COLOR,
-  SHADE_DARK_PURPLE_COLOR,
-  SHADE_LIGHT_GREEN_COLOR,
-  SHADE_LIGHT_PURPLE_COLOR,
-  TEXT_COLOR_NEUTRAL_4
-} from '../../constants';
-
-/*
-  variant: primary, secondary, tertiary(default), icon, close, pagenumber;
-  size: large, small(default);
-  disabled: true, false(default);
-  text: user definition;
-  icon: user definition;
-  endIcon: user definition;
-  onClick: user definition;
-  buttonStyle: user definition;
-  textStyle: user definition;
-  imgStyle: userdefinition;
-*/
-
-export default class MainButton extends Component {
-  constructor(props, context) {
-    super(props, context);
-  }
-
-  render() {
-    const { variant, text, size, icon, endIcon, disabled } = this.props;
-    let padding = '10px 20px';
-
-    if (size === 'large') {
-      if (variant === 'icon' || variant === 'pagenumber') padding = '10px';
-    } else {
-      if (variant === 'icon' || variant === 'pagenumber') padding = '5px';
-      else padding = '5px 10px';
-    }
-
-    const StyledButton = styled.button`
-      /* width: max-content; */
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding: ${padding};
-      border: ${variant === 'primary' ? '0px solid' : '1px solid'};
-      cursor: ${disabled ? 'no-drop' : 'pointer'};
-      user-select: none;
-      background-color: ${variant === 'primary'
-        ? SECONDARY_PURPLE_COLOR
-        : BG_COLOR_1};
-      border-color: ${variant === 'primary' || variant === 'secondary'
-        ? SECONDARY_PURPLE_COLOR
-        : BG_COLOR_1};
-      border-radius: ${variant === 'icon' ? '50%' : '5px'};
-      outline: 0;
-      height: ${size === 'large' ? '40px' : '35px'};
-      width: ${variant === 'icon' || variant === 'pagenumber'
-        ? size === 'large'
-          ? '40px'
-          : '35px'
-        : 'max-content'};
-      :focus {
-        box-shadow: ${!disabled &&
-        `0px 0px 5px 2px ${SHADE_LIGHT_PURPLE_COLOR}`};
-      }
-      :hover {
-        background-color: ${!disabled &&
-        (variant === 'primary' ? SHADE_LIGHT_PURPLE_COLOR : BG_COLOR_0)};
-      }
-      :active {
-        background-color: ${!disabled &&
-        (variant === 'primary' ? SHADE_DARK_PURPLE_COLOR : BG_COLOR_0)};
-      }
-    `;
-
-    const StyledLabel = styled.span`
-      color: ${disabled
-        ? TEXT_COLOR_NEUTRAL_4
-        : variant === 'primary'
-        ? BG_COLOR_1
-        : SECONDARY_PURPLE_COLOR};
-      font-family: ${DEFAULT_FONT_FAMILY};
-      font-size: 13px;
-      font-weight: 600;
-      line-height: 18px;
-      text-align: center;
-    `;
-
-    const StyledImage = styled.img`
-      height: ${size === 'large' ? '20px' : '15px'};
-      width: ${size === 'large' ? '20px' : '15px'};
-      background-color: ${disabled
-        ? TEXT_COLOR_NEUTRAL_4
-        : variant !== 'primary'
-        ? SECONDARY_PURPLE_COLOR
-        : BG_COLOR_1};
-      -webkit-mask-image: url(${props => props.maskImage + '?nocache=2025'});
-      -webkit-mask-size: 90%;
-      -webkit-mask-repeat: no-repeat;
-      -webkit-mask-position: center;
-    `;
-
-    if (variant === 'icon' && text)
-      console.log('If your variant is icon, you cannnot use text');
-    if (variant === 'icon' && endIcon)
-      console.log('If your variant is icon, you cannnot use endIcon');
-    if (variant === 'icon' && (icon || endIcon))
-      console.log(
-        'If your variant is pagenumber, you cannnot use icon or endIcon'
-      );
-    if (variant === 'close' && icon)
-      console.log('If your variant is close, you cannnot use icon');
-
-    return (
-      <StyledButton
-        onClick={!disabled && this.props.onClick}
-        style={{ ...this.props.buttonStyle }}
-      >
-        {variant !== 'pagenumber' && variant !== 'close' && icon && (
-          <StyledImage
-            style={{
-              ...this.props.imgStyle,
-              marginRight: variant !== 'icon' && 10
-            }}
-            maskImage={icon}
-          />
-        )}
-        {variant !== 'icon' && (
-          <StyledLabel style={{ ...this.props.textStyle }}>
-            {variant === 'pagenumber'
-              ? parseInt(text)
-                ? parseInt(text)
-                : 0
-              : text}
-          </StyledLabel>
-        )}
-        {variant !== 'pagenumber' && variant !== 'icon' && endIcon && (
-          <StyledImage style={{ marginLeft: 10 }} maskImage={endIcon} />
-        )}
-      </StyledButton>
-    );
-  }
-}
-
-MainButton.propTypes = {
-  variant: PropTypes.string.isRequired,
-  size: PropTypes.string.isRequired,
-  onClick: PropTypes.func
-};

package/src/components/button/ToggleMeasureButton.jsx

@@ -1,65 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import styled from 'styled-components';
-
-const Toggle = styled.div`
-  display: flex;
-  align-items: center;
-  position: relative;
-  height: 36px;
-  margin-left: 20px;
-  justify-content: center;
-  font-size: 14px;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  :hover {
-    box-shadow: 0px 3px 5px -1px rgba(156, 154, 154, 0.2),
-      0px 6px 10px 0px rgba(156, 154, 154, 0.39),
-      0px 1px 18px 0px rgba(156, 154, 154, 0.12);
-    border-radius: 18px;
-  }
-`;
-
-const ToggleIcon = styled.div`
-  ${'' /* transition-duration: .3s; */}
-  position: absolute;
-  top: 0px;
-  img {
-    font-size: 1.4rem;
-    box-sizing: border-box;
-    border-radius: 50%;
-  }
-`;
-
-export default class ToggleMeasureButton extends Component {
-  constructor(props, context) {
-    super(props, context);
-  }
-
-  render() {
-    let { props } = this;
-    let activeStyle = props.showMeasure === 0 ? { left: 0 } : { right: 0 };
-    return (
-      <Toggle onClick={props.onClick} style={{ ...props.style }}>
-        {props.backgroundImage}
-        {[
-          props.icon !== undefined ? (
-            <ToggleIcon style={{ ...activeStyle }} key={props.icon}>
-              {props.icon}
-            </ToggleIcon>
-          ) : null
-        ]}
-      </Toggle>
-    );
-  }
-}
-
-ToggleMeasureButton.propTypes = {
-  title: PropTypes.string,
-  hover: PropTypes.bool,
-  active: PropTypes.bool.isRequired,
-  onClick: PropTypes.func
-};

package/src/components/catalog-view/catalog-breadcrumb.jsx

@@ -1,53 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { MdArrowBack as Arrow } from 'react-icons/md';
-import * as SharedStyle from '../../shared-style';
-
-const breadcrumbStyle = {
-  margin: '1.5em',
-  display: 'flex'
-};
-
-const breadcrumbTextStyle = {
-  fontSize: '20px',
-  cursor: 'pointer'
-};
-
-const breadcrumbLastTextStyle = {
-  ...breadcrumbTextStyle,
-  fontWeight: 'bolder',
-  color: SharedStyle.SECONDARY_COLOR.main
-};
-
-const breadcrumbTabStyle = {
-  fill: SharedStyle.COLORS.black,
-  fontSize: '24px',
-  marginLeft: '10px',
-  marginRight: '10px'
-};
-
-const CatalogBreadcrumb = ({ names }) => {
-  let labelNames = names.map((name, ind) => {
-    let lastElement = ind === names.length - 1;
-
-    return (
-      <div key={ind} style={{ display: 'flex' }}>
-        <div
-          style={!lastElement ? breadcrumbTextStyle : breadcrumbLastTextStyle}
-          onClick={name.action || null}
-        >
-          {name.name}
-        </div>
-        {!lastElement ? <Arrow style={breadcrumbTabStyle} /> : null}
-      </div>
-    );
-  });
-
-  return <div style={breadcrumbStyle}>{labelNames}</div>;
-};
-
-CatalogBreadcrumb.propTypes = {
-  names: PropTypes.arrayOf(PropTypes.object).isRequired
-};
-
-export default CatalogBreadcrumb;

package/src/components/catalog-view/catalog-item.jsx

@@ -1,229 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { FaPlusCircle as IconAdd } from 'react-icons/fa';
-import * as SharedStyle from '../../shared-style';
-import { API_SERVER_URL, MODE, MODE_IDLE } from '../../constants';
-import browserHistory from '../../@history';
-import axios from 'axios';
-import SnackBar from '../atoms/Snackbar/index';
-const AWS = require('aws-sdk');
-
-const s3 = new AWS.S3({
-  accessKeyId: process.env.REACT_APP_AWS_ID,
-  secretAccessKey: process.env.REACT_APP_AWS_SECRET
-});
-
-const STYLE_BOX = {
-  width: '14em',
-  height: '14em',
-  padding: '0.625em',
-  background: '#f7f7f9',
-  border: '1px solid #e1e1e8',
-  cursor: 'pointer',
-  position: 'relative',
-  boxShadow: '0 1px 6px 0 rgba(0, 0, 0, 0.11), 0 1px 4px 0 rgba(0, 0, 0, 0.11)',
-  borderRadius: '2px',
-  transition: 'all .15s ease-in-out',
-  WebkitTransition: 'all .15s ease-in-out',
-  alignSelf: 'center',
-  justifySelf: 'center'
-};
-
-const STYLE_BOX_HOVER = {
-  ...STYLE_BOX,
-  background: SharedStyle.SECONDARY_COLOR.main
-};
-
-const STYLE_TITLE = {
-  width: '100%',
-  textAlign: 'center',
-  display: 'block',
-  marginBottom: '.5em',
-  textTransform: 'capitalize'
-};
-
-const STYLE_TITLE_HOVER = {
-  ...STYLE_TITLE,
-  color: SharedStyle.COLORS.white
-};
-
-const STYLE_IMAGE_CONTAINER = {
-  width: '100%',
-  height: '8em',
-  position: 'relative',
-  overflow: 'hidden',
-  border: 'solid 1px #e6e6e6',
-  padding: 0,
-  margin: 0,
-  marginBottom: '5px'
-};
-
-const STYLE_IMAGE = {
-  position: 'absolute',
-  background: '#222',
-  width: '100%',
-  height: '100%',
-  backgroundSize: 'contain',
-  backgroundPosition: '50% 50%',
-  backgroundColor: SharedStyle.COLORS.white,
-  backgroundRepeat: 'no-repeat',
-  transition: 'all .2s ease-in-out'
-};
-
-const STYLE_IMAGE_HOVER = {
-  ...STYLE_IMAGE,
-  transform: 'scale(1.2)'
-};
-
-const STYLE_PLUS_HOVER = {
-  marginTop: '1.5em',
-  color: SharedStyle.SECONDARY_COLOR.main,
-  fontSize: '2em',
-  opacity: '0.7',
-  width: '100%'
-};
-
-const STYLE_DESCRIPTION = {
-  display: 'block',
-  display: '-webkit-box',
-  height: '2em',
-  margin: '0 auto',
-  fontSize: '0.75em',
-  fontStyle: 'italic',
-  lineHeight: '1em',
-  WebkitLineClamp: '2',
-  WebkitBoxOrient: 'vertical',
-  overflow: 'hidden',
-  textOverflow: 'ellipsis'
-};
-
-const STYLE_TAGS = {
-  listStyle: 'none',
-  margin: '0px',
-  padding: '0px',
-  fontSize: '11px',
-  marginBottom: '3px'
-};
-
-const STYLE_TAG = {
-  display: 'inline-block',
-  background: '#337ab7',
-  color: SharedStyle.COLORS.white,
-  padding: '1px 4px',
-  marginRight: '3px',
-  borderRadius: '3px'
-};
-
-const STYLE_ASSIGN_TAG = {
-  display: 'inline-block',
-  background: '#33b768',
-  color: SharedStyle.COLORS.white,
-  padding: '1px 4px',
-  marginRight: '3px',
-  borderRadius: '3px'
-};
-
-export default class CatalogItem extends Component {
-  constructor(props) {
-    super(props);
-    this.state = { hover: false, snackBarMessage: '', isSnackBarOpen: '' };
-  }
-
-  select(element) {
-    sessionStorage.setItem('projectTitle', element.title);
-    this.context.projectActions.rename(element.title);
-    sessionStorage.setItem('projectId', element.id);
-    sessionStorage.setItem('email', element.email);
-    const _self = this;
-    if (MODE === 'production') {
-      s3.getObject(
-        {
-          Bucket: process.env.REACT_APP_AWS_BUCKET_NAME,
-          Key: element.data
-        },
-        function (err, data) {
-          if (err !== null) {
-            console.log(err);
-            this.setState({
-              snackBarMessage: 'Something went wrong.',
-              isSnackBarOpen: true
-            });
-            return;
-          }
-          var fileData = data.Body.toString('utf-8');
-          const jsonData = JSON.parse(fileData);
-          _self.context.projectActions.loadProject(
-            jsonData,
-            this.props.categoryData
-          );
-        }
-      );
-    } else {
-      axios
-        .post(`${API_SERVER_URL}/api/project/loadPidData`, {
-          pid: element.id
-        })
-        .then(response => {
-          const jsonData = JSON.parse(response.data.data);
-          this.context.projectActions.loadProject(
-            jsonData,
-            this.props.categoryData
-          );
-        });
-    }
-    this.context.projectActions.setMode(MODE_IDLE);
-    const visualizerName = sessionStorage.getItem('visualizerName');
-    browserHistory.push({
-      pathname: `/${visualizerName}/project/${
-        element.role
-      }/${sessionStorage.getItem('jwt_access_token')}/${element.id}`
-    });
-  }
-
-  render() {
-    let element = this.props.element;
-    let hover = this.state.hover;
-    return (
-      <div
-        style={hover ? STYLE_BOX_HOVER : STYLE_BOX}
-        onClick={e => {
-          e.preventDefault(), this.select(element);
-        }}
-        onMouseEnter={e => this.setState({ hover: true })}
-        onMouseLeave={e => this.setState({ hover: false })}
-      >
-        <SnackBar
-          isOpen={this.state.isSnackBarOpen}
-          message={this.state.snackBarMessage}
-          handleClose={() =>
-            this.setState({ isSnackBarOpen: false, snackBarMessage: '' })
-          }
-        />
-        <b style={STYLE_TITLE}>{element.title}</b>
-        <div style={STYLE_IMAGE_CONTAINER}>
-          <div style={{ ...STYLE_IMAGE }}>
-            {hover ? <IconAdd style={STYLE_PLUS_HOVER} /> : null}
-          </div>
-        </div>
-        <ul style={STYLE_TAGS}>
-          {element.is_assistance_requested === 1 ? (
-            <li style={STYLE_ASSIGN_TAG}>Assign</li>
-          ) : null}
-          <li style={STYLE_TAG}>{element.saved_at}</li>
-        </ul>
-        {/* <div style={STYLE_DESCRIPTION}>{element.info.description}</div> */}
-      </div>
-    );
-  }
-}
-
-CatalogItem.propTypes = {
-  element: PropTypes.object.isRequired
-};
-
-CatalogItem.contextTypes = {
-  itemsActions: PropTypes.object.isRequired,
-  linesActions: PropTypes.object.isRequired,
-  holesActions: PropTypes.object.isRequired,
-  projectActions: PropTypes.object.isRequired
-};