feat(basic/ts): add typescript basic react chef #42
Conversation
| return `import React from 'react' | ||
| import { BrowserRouter as Router } from 'react-router-dom' | ||
| import { createBrowserHistory } from 'history' | ||
| import Routes from './Routes' | ||
| // Block Components. | ||
| import { ErrorHandler, PageLoader } from './components/blocks' | ||
| import { withTranslation } from '@/${sourceDir.i18n}' | ||
| const browserHistory = createBrowserHistory() | ||
| function App() { | ||
| return ( | ||
| <ErrorHandler> | ||
| <PageLoader /> | ||
| <Router history={browserHistory}> | ||
| <Routes /> | ||
| </Router> | ||
| </ErrorHandler> | ||
| ) | ||
| } | ||
| export default withTranslation(App) |
There was a problem hiding this comment.
these need to be typescript typed code
| function getSourceCode(appName, { sourceDir }) { | ||
| return `import React from 'react' | ||
| import { useNavigate } from 'react-router-dom' | ||
| import PropTypes from 'prop-types' |
There was a problem hiding this comment.
getSourceCode returning code should be typed code.
| // UI Components. | ||
| import { Spinner } from '@/components/ui' | ||
| export default function PageLoader({ loading }) { |
| import { RoutePaths } from '@/utils' | ||
| // Lazy-loaded modules | ||
| const SignInModule = React.lazy(() => |
There was a problem hiding this comment.
typed code is missing. its javascript
| // Utils. | ||
| import { RoutePaths } from '@/${sourceDir.utility}' | ||
| const Sidebar = (props) => { |
There was a problem hiding this comment.
typed code is missing. its javascript
| @@ -0,0 +1,7 @@ | |||
| import React from 'react' | |||
|
|
|||
| const BlockLoader = ({ props }) => { | |||
There was a problem hiding this comment.
typed code is missing. its javascript
| const [error, setError] = useState() | ||
| const [loading, setLoading] = useState(false) | ||
|
|
||
| useEffect(async () => { |
There was a problem hiding this comment.
typed code is missing. its javascript
| function useOnlineStatus() { | ||
| const [online, setOnline] = useState(window.navigator.onLine) | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
typed code is missing. its javascript
| const [error, setError] = useState() | ||
| const [loading, setLoading] = useState(false) | ||
|
|
||
| const postData = async (payload) => { |
There was a problem hiding this comment.
typed code is missing. its javascript
| // Utils. | ||
| import { RoutePaths } from '@/utils' | ||
|
|
||
| const NotFound = () => { |
There was a problem hiding this comment.
typed code is missing. its javascript
recipes/_ts/basic/config.js
Outdated
| "webpackLoaders", | ||
| "babel", | ||
| "basicTypescriptDev" | ||
|
|
| Sidebar: sidebarBlock, | ||
| TopBar: topBarBlock, | ||
| } | ||
|
|
| if (isTypeScriptProjectType) { | ||
| const tsConfigFileName = `tsconfig.json`; | ||
| createFile(tsConfigFileName, getFileContent(tsConfigFileName)); | ||
| } |
There was a problem hiding this comment.
this changes not required and its already exist in 226
| let projectTypeName; | ||
| if (is_BasicTypeScriptProjectType) { | ||
| projectTypeName = 'basic'; | ||
| } else if (isSlimTypeScriptProject(projectType)) { | ||
| projectTypeName = 'slim'; | ||
| } else { | ||
| projectTypeName = projectType; | ||
| } |
There was a problem hiding this comment.
can is_BasicTypeScriptProjectType rename to isBasicTypeScriptProjectType
| const browserHistory: History = createBrowserHistory() | ||
| const App: React.FC = () => { |
There was a problem hiding this comment.
try this below.
interface AppProps extends WithTranslation {}
const App: React.FC<AppProps> = (props) => {
| interface DashboardProps { | ||
| title?: string | ||
| } |
There was a problem hiding this comment.
this need to be separate file in types/dashboard.ts
There was a problem hiding this comment.
Already this file after installation it will add inside module folder
2 participants
Basic TypeScript App on React Chef.