4a02dc5a17
**Affected examples** with-segment-analytics with-slate with-portals-ssr ( _with-portals-ssr is based on a package not being updated in the last year_) with-videojs with-next-page-transitions with-firebase-cloud-messaging with-dynamic-app-layout with-dynamic-import with-next-transition with-carbon-components with-cerebral with-custom-babel-config Here and there I have removed some redundant imports as well. I believe with this PR, there are only 1 or 2 examples left using class-based components. If by any chance you find any, let me know and I'll refactor them too. If you don't like anything or you want me to change something, please let me know. **If there is anything else you'd like me to help with, I would be honored to assist.**
37 lines
904 B
JavaScript
37 lines
904 B
JavaScript
import { useState, useEffect } from 'react'
|
|
|
|
const MyLuckNo = () => {
|
|
const [randomNumber, setRandomNumber] = useState(null)
|
|
|
|
const recalculate = () => {
|
|
setRandomNumber(Math.ceil(Math.random() * 100))
|
|
}
|
|
|
|
useEffect(() => {
|
|
recalculate()
|
|
}, [])
|
|
|
|
const message = do {
|
|
if (randomNumber < 30) {
|
|
// eslint-disable-next-line no-unused-expressions
|
|
;('Do not give up. Try again.')
|
|
} else if (randomNumber < 60) {
|
|
// eslint-disable-next-line no-unused-expressions
|
|
;('You are a lucky guy')
|
|
} else {
|
|
// eslint-disable-next-line no-unused-expressions
|
|
;('You are soooo lucky!')
|
|
}
|
|
}
|
|
|
|
if (randomNumber === null) return <p>Please wait..</p>
|
|
return (
|
|
<div>
|
|
<h3>Your Lucky number is: "{randomNumber}"</h3>
|
|
<p>{message}</p>
|
|
<button onClick={() => recalculate()}>Try Again</button>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default MyLuckNo
|