Files
StevenandGitHub 4466ba436b chore(examples): use default prettier for examples/templates (#60530)
## Description
This PR ensures that the default prettier config is used for examples
and templates.

This config is compatible with `prettier@3` as well (upgrading prettier
is bigger change that can be a future PR).

## Changes
- Updated `.prettierrc.json` in root with `"trailingComma": "es5"` (will
be needed upgrading to prettier@3)
- Added `examples/.prettierrc.json` with default config (this will
change every example)
- Added `packages/create-next-app/templates/.prettierrc.json` with
default config (this will change every template)

## Related

- Fixes #54402
- Closes #54409
2024-01-11 16:01:44 -07:00

46 lines
1003 B
JavaScript

import { useState, useEffect } from "react";
import PropTypes from "prop-types";
import Link from "next/link";
const About = (props) => {
const [loaded, setLoaded] = useState(false);
const { pageTransitionReadyToEnter } = props;
useEffect(() => {
const timeoutId = setTimeout(() => {
pageTransitionReadyToEnter();
setLoaded(true);
}, 2000);
return () => {
clearTimeout(timeoutId);
};
}, [pageTransitionReadyToEnter]);
if (!loaded) return null;
return (
<div className="container bg-success page">
<h1>About us</h1>
<p>
Notice how a loading spinner showed up while my content was "loading"?
Pretty neat, huh?
</p>
<Link href="/" className="btn btn-light">
Go back home
</Link>
</div>
);
};
About.propTypes = {
pageTransitionReadyToEnter: PropTypes.func,
};
About.defaultProps = {
pageTransitionReadyToEnter: () => {},
};
About.pageTransitionDelayEnter = true;
export default About;