10966131557

Committed 20 Sep 2024 08:53PM UTC coverage: 31.848% (-0.07%) from 31.915%

Build # 10966131557

Build Type

Pull #9771

github

Committed by

Raemon

Commit Message

admin only

Pull Request Pull Request #9771: JargonBot (admin only)

Run Details

5078 of 41405 branches covered (12.26%)

Branch coverage included in aggregate %.

19 of 87 new or added lines in 8 files covered. (21.84%)

3 existing lines in 2 files now uncovered.

29459 of 67039 relevant lines covered (43.94%)

184.6 hits per line

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

39.13

/packages/lesswrong/components/jargon/JargonTooltip.tsx

// TODO: Import component in components.ts
import React from 'react';
import { Components, registerComponent } from '../../lib/vulcan-lib';
import { useTracking } from "../../lib/analyticsEvents";
import Card from '@material-ui/core/Card';
import { commentBodyStyles } from '@/themes/stylePiping';
import { ContentReplacedSubstringComponentInfo } from '../common/ContentItemBody';

const styles = (theme: ThemeType) => ({
  card: {
    padding: 16,
    backgroundColor: theme.palette.background.pageActiveAreaBackground,
    maxWidth: "350px",
    ...commentBodyStyles(theme),
    color: theme.palette.grey[700],
    marginTop: 0,
    marginBottom: 0,
  },
  jargonWord: {
    color: theme.palette.grey[600],
  },
  altTerms: {
    marginTop: 8,
  },
  altTerm: {
    color: theme.palette.grey[600],
    fontSize: "0.8em",
    marginRight: 8,
  }
});

export const JargonTooltip = ({classes, children, term, replacedSubstrings, isFirstOccurrence = false, placement="bottom-start"}: {
  classes: ClassesType<typeof styles>,
  children: React.ReactNode,
  term: string,
  replacedSubstrings: Record<string, ContentReplacedSubstringComponentInfo>,
  isFirstOccurrence?: boolean,
  placement?: "bottom-start" | "bottom-end" | "top-start" | "top-end" | "left-start" | "left-end" | "right-start" | "right-end"
}) => {
  const { LWTooltip, ContentItemBody } = Components;
  const termInfo = replacedSubstrings[term];
  const glossaryWithoutTermOrAltTerms = Object.fromEntries(
    Object.entries(replacedSubstrings).filter(([key]) => key !== term && !termInfo.props.altTerms.includes(key))
  );
  const tooltip = <Card className={classes.card}>
    <ContentItemBody dangerouslySetInnerHTML={{ __html: termInfo.props.text }} glossary={glossaryWithoutTermOrAltTerms} />
    <div className={classes.altTerms}>
      {termInfo.props.altTerms.map((term: string) => (
        <span className={classes.altTerm} key={term}>{term}</span>
      ))}
    </div>
  </Card>  
  const { captureEvent } = useTracking(); //it is virtuous to add analytics tracking to new components
  return <LWTooltip title={tooltip} tooltip={false} placement={placement} clickable={true}>
    <span className={ isFirstOccurrence ? classes.jargonWord : undefined}>
      {children}
    </span>
  </LWTooltip>;
}

const JargonTooltipComponent = registerComponent('JargonTooltip', JargonTooltip, {styles});

declare global {
  interface ComponentTypes {
    JargonTooltip: typeof JargonTooltipComponent
  }
}

1	// TODO: Import component in components.ts	3✔
2	import React from 'react';	1✔
3	import { Components, registerComponent } from '../../lib/vulcan-lib';	1✔
4	import { useTracking } from "../../lib/analyticsEvents";	1✔
5	import Card from '@material-ui/core/Card';	1✔
6	import { commentBodyStyles } from '@/themes/stylePiping';	1✔
7	import { ContentReplacedSubstringComponentInfo } from '../common/ContentItemBody';
8
9	const styles = (theme: ThemeType) => ({	1✔
10	card: {
11	padding: 16,
12	backgroundColor: theme.palette.background.pageActiveAreaBackground,
13	maxWidth: "350px",
14	...commentBodyStyles(theme),
15	color: theme.palette.grey[700],
16	marginTop: 0,
17	marginBottom: 0,
18	},
19	jargonWord: {
20	color: theme.palette.grey[600],
21	},
22	altTerms: {
23	marginTop: 8,
24	},
25	altTerm: {
26	color: theme.palette.grey[600],
27	fontSize: "0.8em",
28	marginRight: 8,
29	}
30	});
31
32	export const JargonTooltip = ({classes, children, term, replacedSubstrings, isFirstOccurrence = false, placement="bottom-start"}: {	1!
33	classes: ClassesType<typeof styles>,
34	children: React.ReactNode,
35	term: string,
36	replacedSubstrings: Record<string, ContentReplacedSubstringComponentInfo>,
37	isFirstOccurrence?: boolean,
38	placement?: "bottom-start" \| "bottom-end" \| "top-start" \| "top-end" \| "left-start" \| "left-end" \| "right-start" \| "right-end"
39	}) => {
NEW 40	const { LWTooltip, ContentItemBody } = Components;	×
NEW 41	const termInfo = replacedSubstrings[term];	×
NEW 42	const glossaryWithoutTermOrAltTerms = Object.fromEntries(	×
NEW 43	Object.entries(replacedSubstrings).filter(([key]) => key !== term && !termInfo.props.altTerms.includes(key))	×
44	);
NEW 45	const tooltip = <Card className={classes.card}>	×
46	<ContentItemBody dangerouslySetInnerHTML={{ __html: termInfo.props.text }} glossary={glossaryWithoutTermOrAltTerms} />
47	<div className={classes.altTerms}>
48	{termInfo.props.altTerms.map((term: string) => (
NEW 49	<span className={classes.altTerm} key={term}>{term}</span>	×
50	))}
51	</div>
52	</Card>
NEW 53	const { captureEvent } = useTracking(); //it is virtuous to add analytics tracking to new components	×
NEW 54	return <LWTooltip title={tooltip} tooltip={false} placement={placement} clickable={true}>	×
55	<span className={ isFirstOccurrence ? classes.jargonWord : undefined}>	×
56	{children}
57	</span>
58	</LWTooltip>;
59	}
60
61	const JargonTooltipComponent = registerComponent('JargonTooltip', JargonTooltip, {styles});	1✔
62
63	declare global {
64	interface ComponentTypes {
65	JargonTooltip: typeof JargonTooltipComponent
66	}
67	}

ForumMagnum / ForumMagnum / 10966131557

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