Commit 3ab698f1 authored by Robert Knight's avatar Robert Knight

Convert ShareLinks and Tutorial propTypes docs to JSDoc

This enables checking by TypeScript
parent 8986c475
import { SvgIcon } from '@hypothesis/frontend-shared';
import propTypes from 'prop-types';
import { withServices } from '../service-context';
/**
* @typedef ShareLinkProps
* @prop {string} iconName - The name of the SVG icon to use for this link
* @prop {string} label - Accessible label/tooltip for link
* @prop {string} uri - URI for sharing this annotation
* @prop {() => void} onClick - Callback for analytics tracking
*/
/**
* A single sharing link as a list item
*
* @param {ShareLinkProps} props
*/
function ShareLink({ label, iconName, uri, onClick }) {
return (
......@@ -23,16 +32,12 @@ function ShareLink({ label, iconName, uri, onClick }) {
);
}
ShareLink.propTypes = {
/** The name of the SVG icon to use for this link */
iconName: propTypes.string.isRequired,
/** Accessible label / tooltip for link. */
label: propTypes.string.isRequired,
/** URI for sharing this annotation on the given social service */
uri: propTypes.string.isRequired,
/** click callback (for analytics tracking) */
onClick: propTypes.func.isRequired,
};
/**
* @typedef ShareLinksProps
* @prop {object} analytics
* @prop {string} analyticsEventName
* @prop {string} shareURI - The URL to share
*/
/**
* A list of share links to social-media platforms.
......@@ -78,16 +83,6 @@ function ShareLinks({ analytics, analyticsEventName, shareURI }) {
);
}
ShareLinks.propTypes = {
/** Analytics event to track when share links are clicked */
analyticsEventName: propTypes.string.isRequired,
/** URI to shared resource(s), e.g. an annotation or collection of annotations */
shareURI: propTypes.string.isRequired,
// Services/injected
analytics: propTypes.object.isRequired,
};
ShareLinks.injectedProps = ['analytics'];
export default withServices(ShareLinks);
......@@ -7,6 +7,10 @@ import { withServices } from '../service-context';
* Subcomponent: an "instruction" within the tutorial step that includes an
* icon and a "command" associated with that icon. Encapsulating these together
* allows for styling to keep them from having a line break between them.
*
* @param {object} props
* @param {string} props.commandName - Name of the "command" the instruction represents
* @param {string} props.iconName - Name of the icon to display
*/
function TutorialInstruction({ commandName, iconName }) {
return (
......@@ -17,13 +21,6 @@ function TutorialInstruction({ commandName, iconName }) {
);
}
TutorialInstruction.propTypes = {
/* the name of the "command" the instruction represents, e.g. "Annotate" */
commandName: propTypes.string.isRequired,
/* the name of the SVGIcon to display with this instruction */
iconName: propTypes.string.isRequired,
};
/**
* Tutorial for using the sidebar app
*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment