mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-23 12:13:11 +00:00
Add flow types to utils
This commit is contained in:
3
flow-typed/slugify.js
vendored
Normal file
3
flow-typed/slugify.js
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
declare module 'slugify' {
|
||||
declare module.exports: any;
|
||||
}
|
||||
@@ -2,6 +2,7 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
@@ -12,7 +13,19 @@ import ExternalLinkSvg from 'templates/components/ExternalLinkSvg';
|
||||
import slugify from 'utils/slugify';
|
||||
import {colors, media} from 'theme';
|
||||
|
||||
const createLinkBlog = ({isActive, item, section}) => {
|
||||
import type {Node} from 'react';
|
||||
|
||||
type CreateLinkBaseProps = {
|
||||
isActive: boolean,
|
||||
item: Object,
|
||||
section: Object,
|
||||
};
|
||||
|
||||
const createLinkBlog = ({
|
||||
isActive,
|
||||
item,
|
||||
section,
|
||||
}: CreateLinkBaseProps): Node => {
|
||||
return (
|
||||
<Link css={[linkCss, isActive && activeLinkCss]} to={item.id}>
|
||||
{isActive && <span css={activeLinkBefore} />}
|
||||
@@ -21,7 +34,11 @@ const createLinkBlog = ({isActive, item, section}) => {
|
||||
);
|
||||
};
|
||||
|
||||
const createLinkCommunity = ({isActive, item, section}) => {
|
||||
const createLinkCommunity = ({
|
||||
isActive,
|
||||
item,
|
||||
section,
|
||||
}: CreateLinkBaseProps): Node => {
|
||||
if (item.href) {
|
||||
return (
|
||||
<a css={[linkCss]} href={item.href} target="_blank" rel="noopener">
|
||||
@@ -44,7 +61,11 @@ const createLinkCommunity = ({isActive, item, section}) => {
|
||||
});
|
||||
};
|
||||
|
||||
const createLinkDocs = ({isActive, item, section}) => {
|
||||
const createLinkDocs = ({
|
||||
isActive,
|
||||
item,
|
||||
section,
|
||||
}: CreateLinkBaseProps): Node => {
|
||||
return (
|
||||
<Link
|
||||
css={[linkCss, isActive && activeLinkCss]}
|
||||
@@ -55,7 +76,16 @@ const createLinkDocs = ({isActive, item, section}) => {
|
||||
);
|
||||
};
|
||||
|
||||
const createLinkTutorial = ({isActive, item, onLinkClick, section}) => {
|
||||
type CreateLinkTutorialProps = {
|
||||
onLinkClick: Function,
|
||||
} & CreateLinkBaseProps;
|
||||
|
||||
const createLinkTutorial = ({
|
||||
isActive,
|
||||
item,
|
||||
onLinkClick,
|
||||
section,
|
||||
}: CreateLinkTutorialProps): Node => {
|
||||
return (
|
||||
<Link
|
||||
css={[linkCss, isActive && activeLinkCss]}
|
||||
|
||||
@@ -2,11 +2,12 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
import {urlRoot} from 'site-constants';
|
||||
|
||||
export default slug =>
|
||||
export default (slug: string): string | null =>
|
||||
slug == null ? null : `${urlRoot}/${slug.replace(/^\//, '')}`;
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
@@ -12,7 +13,20 @@ import slugify from './slugify';
|
||||
* Helper method to locate the section containing the current URL/path.
|
||||
* This method specifically works with the nav_*.yml format.
|
||||
*/
|
||||
const findSectionForPath = (pathname, sections) => {
|
||||
|
||||
type Item = {
|
||||
id: string,
|
||||
subitems: Array<Item>,
|
||||
};
|
||||
|
||||
type Section = {
|
||||
items: Array<Item>,
|
||||
};
|
||||
|
||||
const findSectionForPath = (
|
||||
pathname: string,
|
||||
sections: Array<Section>,
|
||||
): Section | void => {
|
||||
let activeSection;
|
||||
const slugId = pathname.split('/').slice(-1)[0];
|
||||
|
||||
|
||||
@@ -2,13 +2,14 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
import slugify from 'utils/slugify';
|
||||
|
||||
const toAnchor = (href = '') => {
|
||||
const toAnchor = (href: string = ''): string => {
|
||||
const index = href.indexOf('#');
|
||||
return index >= 0 ? href.substr(index) : '';
|
||||
};
|
||||
@@ -16,7 +17,12 @@ const toAnchor = (href = '') => {
|
||||
// TODO Account for redirect_from URLs somehow; they currently won't match.
|
||||
// This comment should not be true anymore since we're using 300 redirects
|
||||
|
||||
const isItemActive = (location, item) => {
|
||||
type Item = {
|
||||
id: string,
|
||||
href: string,
|
||||
};
|
||||
|
||||
const isItemActive = (location: Location, item: Item): boolean => {
|
||||
if (location.hash) {
|
||||
if (item.href) {
|
||||
return location.hash === toAnchor(item.href);
|
||||
|
||||
@@ -2,20 +2,24 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
// $FlowExpectedError
|
||||
import navCommunity from '../../content/community/nav.yml';
|
||||
// $FlowExpectedError
|
||||
import navDocs from '../../content/docs/nav.yml';
|
||||
// $FlowExpectedError
|
||||
import navTutorial from '../../content/tutorial/nav.yml';
|
||||
|
||||
const sectionListDocs = navDocs.map(item => ({
|
||||
const sectionListDocs = navDocs.map((item: Object): Object => ({
|
||||
...item,
|
||||
directory: 'docs',
|
||||
}));
|
||||
|
||||
const sectionListCommunity = navCommunity.map(item => ({
|
||||
const sectionListCommunity = navCommunity.map((item: Object): Object => ({
|
||||
...item,
|
||||
directory: 'community',
|
||||
}));
|
||||
|
||||
@@ -2,13 +2,14 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
import slugify from 'slugify';
|
||||
|
||||
export default (string, directory) => {
|
||||
export default (string: string, directory?: string): string => {
|
||||
const filename = slugify(string) + '.html';
|
||||
|
||||
return directory ? `/${directory}/${filename}` : filename;
|
||||
|
||||
@@ -2,16 +2,22 @@
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
*
|
||||
* @emails react-core
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
|
||||
const addString = (list, string) =>
|
||||
import type {Node} from 'react';
|
||||
|
||||
const addString = (list: Array<Node>, string: string) =>
|
||||
list.push(<span key={`${list.length}-${string}`}>{string}</span>);
|
||||
|
||||
const toCommaSeparatedList = (array, renderCallback) => {
|
||||
const toCommaSeparatedList = (
|
||||
array: Array<any>,
|
||||
renderCallback: Function,
|
||||
): Array<any> => {
|
||||
if (array.length <= 1) {
|
||||
return array.map(renderCallback);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user