11505263545

Committed 24 Oct 2024 06:26PM UTC coverage: 31.64% (+0.2%) from 31.476%

Build # 11505263545

Build Type

Pull #9881

github

Committed by

darkruby501

Commit Message

fix test again

Pull Request Pull Request #9881: Switch lw to gill sans nova and update vote styling

Run Details

5061 of 41882 branches covered (12.08%)

Branch coverage included in aggregate %.

42 of 77 new or added lines in 14 files covered. (54.55%)

4 existing lines in 3 files now uncovered.

29634 of 67775 relevant lines covered (43.72%)

180.62 hits per line

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

25.0

/packages/lesswrong/components/votes/VoteArrowIconSolid.tsx

import React from 'react';
import classNames from 'classnames';
import IconButton from '@material-ui/core/IconButton';
import { SoftUpArrowIcon } from '../icons/softUpArrowIcon';
import { SoftUpArrowIconCap } from '../icons/softUpArrowIconCap';
import { useVoteColors } from './useVoteColors';
import { registerComponent } from '@/lib/vulcan-lib';
import { isEAForum } from '../../lib/instanceSettings';
import type { BaseVoteArrowIconProps } from './VoteArrowIcon';

const styles = (theme: ThemeType): JssStyles => ({
  root: {
    color: theme.palette.grey[400],
    fontSize: 'inherit',
    width: 'initial',
    height: 'initial',
    padding: 0,
    position: 'relative',
    '&:hover': {
      backgroundColor: 'transparent',
    },
  },
  disabled: {
    cursor: 'not-allowed',
  },
  smallArrow: {
    opacity: isEAForum ? 0.7 : 0.6,
    pointerEvents: 'none',
  },
  smallArrowLarge: {
    opacity: isEAForum ? 0.7 : 0.6,
    pointerEvents: 'none',
  },
  up: {
  },
  upLarge: {
  },
  down: {
    transform: 'rotate(-180deg)',
    top: 1
  },
  downLarge: {
    transform: 'rotate(-180deg)',
    top: 1
  },
  right: {
    transform: 'rotate(-270deg)',
  },
  rightLarge: {
    transform: 'rotate(-270deg)',
  },
  left: {
    transform: 'rotate(-90deg)',
  },
  leftLarge: {
    transform: 'rotate(-90deg)',
  },
  bigArrow: {
    height: 10,
    width: 10,
    pointerEvents: 'none',
    position: 'absolute',
    top: '-70%',
    fontSize: '82%',
    opacity: 0,
  },
  bigArrowLarge: {
    height: 14,
    width: 14,
    pointerEvents: 'none',
    position: 'absolute',
    top: '-90%',
    fontSize: '100%',
    opacity: 0,
  },
  bigArrowSolid: {
    top: '-35%',
    transform: 'scale(1.4)',
  },
  bigArrowSolidLarge: {
    top: '-30%',
    transform: 'scale(1.6)',
  },
  bigArrowCompleted: {
    fontSize: '90%',
    top: '-35%',
    opacity: 1
  },
  bigArrowCompletedLarge: {
    fontSize: '110%',
    top: '-35%',
    opacity: 1
  },
  entering: {
    transition: `opacity ${theme.voting.strongVoteDelay}ms cubic-bezier(0.74, -0.01, 1, 1) 0ms`,
  }
});

const VoteArrowIconSolid = ({
  orientation,
  enabled = true,
  color,
  voted,
  eventHandlers,
  bigVotingTransition,
  bigVoted,
  bigVoteCompleted,
  alwaysColored,
  strongVoteDelay,
  largeArrow = false,
  classes,
}: BaseVoteArrowIconProps & {
  classes: ClassesType
}) => {

  const { mainColor, lightColor } = useVoteColors(color);

  const iconSize = largeArrow ? 14 : 10;

  const Icon = (
    <SoftUpArrowIcon
      style={{
        color: voted || alwaysColored ? mainColor : 'inherit',
        height: iconSize,
        width: iconSize,
      }}
      className={classNames(largeArrow ? classes.smallArrowLarge : classes.smallArrow)}
    />
  );

  const handlers = enabled ? eventHandlers : {};

  const accentIconClasses = largeArrow
    ? classNames(
        bigVotingTransition && classes.entering,
        classes.bigArrowLarge,
        (bigVotingTransition || bigVoteCompleted || bigVoted) && classes.bigArrowCompletedLarge,
        classes.bigArrowSolidLarge
      )
    : classNames(
        bigVotingTransition && classes.entering,
        classes.bigArrow,
        (bigVotingTransition || bigVoteCompleted || bigVoted) && classes.bigArrowCompleted,
        classes.bigArrowSolid
    );

  return (
    <IconButton
      className={classNames(
        classes.root,
        classes[orientation],
        largeArrow && classes[`${orientation}Large`],
        !enabled && classes.disabled
      )}
      onMouseDown={handlers.handleMouseDown}
      onMouseUp={handlers.handleMouseUp}
      onMouseOut={handlers.clearState}
      onClick={handlers.handleClick}
      disableRipple
    >
      {Icon}
      <SoftUpArrowIconCap
        style={bigVoteCompleted || bigVoted ? { color: lightColor } : {}}
        className={accentIconClasses}
      />
    </IconButton>
  );
};

const VoteArrowIconSolidComponent = registerComponent( 'VoteArrowIconSolid', VoteArrowIconSolid, {styles});

export default VoteArrowIconSolidComponent;

declare global {
  interface ComponentTypes {
    VoteArrowIconSolid: typeof VoteArrowIconSolidComponent;
  }
}


1	import React from 'react';	3✔
2	import classNames from 'classnames';	1✔
3	import IconButton from '@material-ui/core/IconButton';	1✔
4	import { SoftUpArrowIcon } from '../icons/softUpArrowIcon';	1✔
5	import { SoftUpArrowIconCap } from '../icons/softUpArrowIconCap';	1✔
6	import { useVoteColors } from './useVoteColors';	1✔
7	import { registerComponent } from '@/lib/vulcan-lib';	1✔
8	import { isEAForum } from '../../lib/instanceSettings';	1✔
9	import type { BaseVoteArrowIconProps } from './VoteArrowIcon';
10
11	const styles = (theme: ThemeType): JssStyles => ({	1✔
12	root: {
13	color: theme.palette.grey[400],
14	fontSize: 'inherit',
15	width: 'initial',
16	height: 'initial',
17	padding: 0,
18	position: 'relative',
19	'&:hover': {
20	backgroundColor: 'transparent',
21	},
22	},
23	disabled: {
24	cursor: 'not-allowed',
25	},
26	smallArrow: {
27	opacity: isEAForum ? 0.7 : 0.6,	1!
28	pointerEvents: 'none',
29	},
30	smallArrowLarge: {
31	opacity: isEAForum ? 0.7 : 0.6,	1!
32	pointerEvents: 'none',
33	},
34	up: {
35	},
36	upLarge: {
37	},
38	down: {
39	transform: 'rotate(-180deg)',
40	top: 1
41	},
42	downLarge: {
43	transform: 'rotate(-180deg)',
44	top: 1
45	},
46	right: {
47	transform: 'rotate(-270deg)',
48	},
49	rightLarge: {
50	transform: 'rotate(-270deg)',
51	},
52	left: {
53	transform: 'rotate(-90deg)',
54	},
55	leftLarge: {
56	transform: 'rotate(-90deg)',
57	},
58	bigArrow: {
59	height: 10,
60	width: 10,
61	pointerEvents: 'none',
62	position: 'absolute',
63	top: '-70%',
64	fontSize: '82%',
65	opacity: 0,
66	},
67	bigArrowLarge: {
68	height: 14,
69	width: 14,
70	pointerEvents: 'none',
71	position: 'absolute',
72	top: '-90%',
73	fontSize: '100%',
74	opacity: 0,
75	},
76	bigArrowSolid: {
77	top: '-35%',
78	transform: 'scale(1.4)',
79	},
80	bigArrowSolidLarge: {
81	top: '-30%',
82	transform: 'scale(1.6)',
83	},
84	bigArrowCompleted: {
85	fontSize: '90%',
86	top: '-35%',
87	opacity: 1
88	},
89	bigArrowCompletedLarge: {
90	fontSize: '110%',
91	top: '-35%',
92	opacity: 1
93	},
94	entering: {
95	transition: `opacity ${theme.voting.strongVoteDelay}ms cubic-bezier(0.74, -0.01, 1, 1) 0ms`,
96	}
97	});
98
99	const VoteArrowIconSolid = ({	1✔
100	orientation,
101	enabled = true,	×
102	color,
103	voted,
104	eventHandlers,
105	bigVotingTransition,
106	bigVoted,
107	bigVoteCompleted,
108	alwaysColored,
109	strongVoteDelay,
110	largeArrow = false,	×
111	classes,
112	}: BaseVoteArrowIconProps & {
113	classes: ClassesType
114	}) => {
115
NEW 116	const { mainColor, lightColor } = useVoteColors(color);	×
117
NEW 118	const iconSize = largeArrow ? 14 : 10;	×
119
120	const Icon = (
NEW 121	<SoftUpArrowIcon	×
122	style={{
123	color: voted \|\| alwaysColored ? mainColor : 'inherit',	×
124	height: iconSize,
125	width: iconSize,
126	}}
127	className={classNames(largeArrow ? classes.smallArrowLarge : classes.smallArrow)}	×
128	/>
129	);
130
NEW 131	const handlers = enabled ? eventHandlers : {};	×
132
NEW 133	const accentIconClasses = largeArrow	×
134	? classNames(
135	bigVotingTransition && classes.entering,	×
136	classes.bigArrowLarge,
137	(bigVotingTransition \|\| bigVoteCompleted \|\| bigVoted) && classes.bigArrowCompletedLarge,	×
138	classes.bigArrowSolidLarge
139	)
140	: classNames(
141	bigVotingTransition && classes.entering,	×
142	classes.bigArrow,
143	(bigVotingTransition \|\| bigVoteCompleted \|\| bigVoted) && classes.bigArrowCompleted,	×
144	classes.bigArrowSolid
145	);
146
NEW 147	return (	×
148	<IconButton
149	className={classNames(
150	classes.root,
151	classes[orientation],
152	largeArrow && classes[`${orientation}Large`],	×
153	!enabled && classes.disabled	×
154	)}
155	onMouseDown={handlers.handleMouseDown}
156	onMouseUp={handlers.handleMouseUp}
157	onMouseOut={handlers.clearState}
158	onClick={handlers.handleClick}
159	disableRipple
160	>
161	{Icon}
162	<SoftUpArrowIconCap
163	style={bigVoteCompleted \|\| bigVoted ? { color: lightColor } : {}}	×
164	className={accentIconClasses}
165	/>
166	</IconButton>
167	);
168	};
169
170	const VoteArrowIconSolidComponent = registerComponent( 'VoteArrowIconSolid', VoteArrowIconSolid, {styles});	1✔
171
172	export default VoteArrowIconSolidComponent;	1✔
173
174	declare global {
175	interface ComponentTypes {
176	VoteArrowIconSolid: typeof VoteArrowIconSolidComponent;
177	}
178	}
179

ForumMagnum / ForumMagnum / 11505263545

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