memory-cards / cards-exporter / 105

pending completion

Build # 105

Build Type

Pull #30

travis-ci

Committed by

web-flow

Commit Message

Merge branch 'update-cards-page' of https://github.com/memory-cards/cards-exporter into update-cards-page

Pull Request Pull Request #30: add basic updateCards page

Run Details

62 of 65 branches covered (95.38%)

Branch coverage included in aggregate %.

96 of 96 new or added lines in 7 files covered. (100.0%)

226 of 233 relevant lines covered (97.0%)

17.79 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

95.0

/pages/updateCards/components/CardsList/components/Card/index.tsx

import * as React from "react";
import { ICardDefinition } from "~/typings/ICardDefinition";

import "./styles.scss";

interface Props {
  card: ICardDefinition;
  selectCard: (selectedCard: ICardDefinition) => void;
  isSelected: boolean;
}

const Card = ({ card, selectCard, isSelected }: Props) => {
  const onClick = () => {
    selectCard(card);
  };

  const getShortCardQuestion = () => {
    const element = window.document.createElement("div");
    element.innerHTML = card.card.question;
    const text = element.innerText
      .split(" ")
      .slice(0, 10)
      .map(word => (word.length < 30 ? word : word.substr(0, 30)))
      .join(" ");
    return text.length < element.innerText.length ? `${text}...` : text;
  };

  return (
    <li className={isSelected ? "card selected" : "card"} onClick={onClick}>
      <div>{getShortCardQuestion()}</div>
      <br />
      <div>
        {card.tags.map(tag => (
          <span key={tag} className="tag">
            {tag}
          </span>
        ))}
      </div>
    </li>
  );
};

export default Card;

1	import * as React from "react";	3✔
2	import { ICardDefinition } from "~/typings/ICardDefinition";
3
4	import "./styles.scss";	3✔
5
6	interface Props {
7	card: ICardDefinition;
8	selectCard: (selectedCard: ICardDefinition) => void;
9	isSelected: boolean;
10	}
11
12	const Card = ({ card, selectCard, isSelected }: Props) => {	3✔
13	const onClick = () => {	12✔
14	selectCard(card);	×
15	};
16
17	const getShortCardQuestion = () => {	12✔
18	const element = window.document.createElement("div");	12✔
19	element.innerHTML = card.card.question;	12✔
20	const text = element.innerText	12✔
21	.split(" ")
22	.slice(0, 10)
23	.map(word => (word.length < 30 ? word : word.substr(0, 30)))	97✔
24	.join(" ");
25	return text.length < element.innerText.length ? `${text}...` : text;	12✔
26	};
27
28	return (	12✔
29	<li className={isSelected ? "card selected" : "card"} onClick={onClick}>	12✔
30	<div>{getShortCardQuestion()}</div>
31	<br />
32	<div>
33	{card.tags.map(tag => (
34	<span key={tag} className="tag">	22✔
35	{tag}
36	</span>
37	))}
38	</div>
39	</li>
40	);
41	};
42
43	export default Card;	3✔

memory-cards / cards-exporter / 105

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous