-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fe/main build #6
Merged
Merged
Changes from 8 commits
Commits
Show all changes
11 commits
Select commit
Hold shift + click to select a range
bb3446c
chore: Add frontend files and configurations for Remix + Vite integra…
Eventyret cc6cd37
chore: Add frontend files and configurations for Remix + Vite integra…
Eventyret 00f3be6
chore: Update paths in frontend/components.json and frontend/app/root…
Eventyret 67fb926
chore: Update vitest module declaration and add unit tests for add fu…
Eventyret dadb870
chore: Update .gitignore files
Eventyret 2f76507
chore: Added copytypes and setup script
Eventyret 3f1799d
chore: Update ESLint configuration and add TypeScript rule
Eventyret 47057ff
chore: Update tsconfig.json to include new paths for types, server, c…
Eventyret 09f3a16
Moved to react from remix
Eventyret 9cf6929
Updated script according from @derrickmehaffy comment
Eventyret 3431b34
Removed npm clean from setup to make it work on start
Eventyret File filter
Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -128,3 +128,7 @@ dist | |
.yarn/build-state.yml | ||
.yarn/install-state.gz | ||
.pnp.* | ||
|
||
package-lock.json | ||
yarn.lock | ||
pnpm-lock.yaml |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -112,3 +112,5 @@ exports | |
dist | ||
build | ||
.strapi-updater.json | ||
types/ | ||
yarn.lock |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
const fs = require("fs").promises; | ||
const path = require("path"); | ||
const { exec } = require("child_process"); | ||
|
||
const destinationFolder = "frontend/types"; | ||
|
||
// Adjust these paths as per your project structure | ||
const files = [ | ||
{ | ||
src: path.join(__dirname, "./backend/types/generated/contentTypes.d.ts"), | ||
dest: path.join(__dirname, `./${destinationFolder}/contentTypes.d.ts`), | ||
}, | ||
{ | ||
src: path.join(__dirname, "./backend/types/generated/components.d.ts"), | ||
dest: path.join(__dirname, `./${destinationFolder}/components.d.ts`), | ||
}, | ||
]; | ||
|
||
async function generateTypes() { | ||
console.log("🚀 Generating Strapi types..."); | ||
return new Promise((resolve, reject) => { | ||
exec( | ||
"cd backend && yarn strapi ts:generate-types", | ||
(error, stdout, stderr) => { | ||
if (error) { | ||
console.error(`❌ Error generating types: ${error}`); | ||
reject(error); | ||
return; | ||
} | ||
console.log("📄 Types generated successfully"); | ||
resolve(stdout); | ||
} | ||
); | ||
}); | ||
} | ||
|
||
async function copyFile({ src, dest }) { | ||
try { | ||
const destinationDir = path.dirname(dest); | ||
|
||
await fs.mkdir(destinationDir, { recursive: true }).catch((err) => { | ||
if (err.code !== "EEXIST") throw err; // Ignore if the directory exists | ||
}); | ||
|
||
const fileExists = await fs | ||
.stat(src) | ||
.then(() => true) | ||
.catch((err) => { | ||
if (err.code === "ENOENT") { | ||
console.log( | ||
`⚠️ Source file does not exist, will be generated: ${src}` | ||
); | ||
} | ||
return false; | ||
}); | ||
|
||
// Generate types before copying | ||
await generateTypes(); | ||
|
||
// Copy the file directly | ||
await fs.copyFile(src, dest); | ||
|
||
if (fileExists) { | ||
console.log(`🔄 Updated and copied: ${dest}`); | ||
} else { | ||
console.log(`✨ Created and copied: ${dest}`); | ||
} | ||
} catch (err) { | ||
console.error(`❌ Error: Failed to copy ${src} to ${dest}: ${err}`); | ||
process.exit(1); | ||
} | ||
} | ||
|
||
async function main() { | ||
for (const file of files) { | ||
await copyFile(file); | ||
} | ||
} | ||
|
||
main().catch((err) => console.error(`❌ Error during execution: ${err}`)); |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,87 @@ | ||
/** | ||
* This is intended to be a basic starting point for linting in your app. | ||
* It relies on recommended configs out of the box for simplicity, but you can | ||
* and should modify this configuration to best suit your team's needs. | ||
*/ | ||
|
||
/** @type {import('eslint').Linter.Config} */ | ||
module.exports = { | ||
root: true, | ||
parserOptions: { | ||
ecmaVersion: "latest", | ||
sourceType: "module", | ||
ecmaFeatures: { | ||
jsx: true, | ||
}, | ||
}, | ||
env: { | ||
browser: true, | ||
commonjs: true, | ||
es6: true, | ||
}, | ||
ignorePatterns: ["!**/.server", "!**/.client"], | ||
|
||
// Base config | ||
extends: ["eslint:recommended"], | ||
overrides: [ | ||
// React | ||
{ | ||
files: ["**/*.{js,jsx,ts,tsx}"], | ||
plugins: ["react", "jsx-a11y"], | ||
extends: [ | ||
"plugin:react/recommended", | ||
"plugin:react/jsx-runtime", | ||
"plugin:react-hooks/recommended", | ||
"plugin:jsx-a11y/recommended", | ||
], | ||
|
||
settings: { | ||
react: { | ||
version: "detect", | ||
}, | ||
formComponents: ["Form"], | ||
linkComponents: [ | ||
{ name: "Link", linkAttribute: "to" }, | ||
{ name: "NavLink", linkAttribute: "to" }, | ||
], | ||
"import/resolver": { | ||
typescript: {}, | ||
}, | ||
}, | ||
}, | ||
|
||
// Typescript | ||
{ | ||
files: ["**/*.{ts,tsx}"], | ||
plugins: ["@typescript-eslint", "import"], | ||
parser: "@typescript-eslint/parser", | ||
settings: { | ||
"import/internal-regex": "^~/", | ||
"import/resolver": { | ||
node: { | ||
extensions: [".ts", ".tsx"], | ||
}, | ||
typescript: { | ||
alwaysTryTypes: true, | ||
}, | ||
}, | ||
}, | ||
extends: [ | ||
"plugin:@typescript-eslint/recommended", | ||
"plugin:import/recommended", | ||
"plugin:import/typescript", | ||
], | ||
rules: { | ||
"@typescript-eslint/no-unused-vars": ["warn"], | ||
}, | ||
}, | ||
|
||
// Node | ||
{ | ||
files: [".eslintrc.cjs"], | ||
env: { | ||
node: true, | ||
}, | ||
}, | ||
], | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
node_modules | ||
|
||
/.cache | ||
/build | ||
.env | ||
pnpm-lock.yaml | ||
types | ||
yarn.lock | ||
package-lock.json |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
# Welcome to Remix + Vite! | ||
|
||
📖 See the [Remix docs](https://remix.run/docs) and the [Remix Vite docs](https://remix.run/docs/en/main/future/vite) for details on supported features. | ||
|
||
## Development | ||
|
||
Run the Vite dev server: | ||
|
||
```shellscript | ||
npm run dev | ||
``` | ||
|
||
## Deployment | ||
|
||
First, build your app for production: | ||
|
||
```sh | ||
npm run build | ||
``` | ||
|
||
Then run the app in production mode: | ||
|
||
```sh | ||
npm start | ||
``` | ||
|
||
Now you'll need to pick a host to deploy it to. | ||
|
||
### DIY | ||
|
||
If you're familiar with deploying Node applications, the built-in Remix app server is production-ready. | ||
|
||
Make sure to deploy the output of `npm run build` | ||
|
||
- `build/server` | ||
- `build/client` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
/** | ||
* By default, Remix will handle hydrating your app on the client for you. | ||
* You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨ | ||
* For more information, see https://remix.run/file-conventions/entry.client | ||
*/ | ||
|
||
import { RemixBrowser } from "@remix-run/react"; | ||
import { startTransition, StrictMode } from "react"; | ||
import { hydrateRoot } from "react-dom/client"; | ||
|
||
startTransition(() => { | ||
hydrateRoot( | ||
document, | ||
<StrictMode> | ||
<RemixBrowser /> | ||
</StrictMode> | ||
); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,140 @@ | ||
/** | ||
* By default, Remix will handle generating the HTTP Response for you. | ||
* You are free to delete this file if you'd like to, but if you ever want it revealed again, you can run `npx remix reveal` ✨ | ||
* For more information, see https://remix.run/file-conventions/entry.server | ||
*/ | ||
|
||
import { PassThrough } from "node:stream"; | ||
|
||
import type { AppLoadContext, EntryContext } from "@remix-run/node"; | ||
import { createReadableStreamFromReadable } from "@remix-run/node"; | ||
import { RemixServer } from "@remix-run/react"; | ||
import { isbot } from "isbot"; | ||
import { renderToPipeableStream } from "react-dom/server"; | ||
|
||
const ABORT_DELAY = 5_000; | ||
|
||
export default function handleRequest( | ||
request: Request, | ||
responseStatusCode: number, | ||
responseHeaders: Headers, | ||
remixContext: EntryContext, | ||
// This is ignored so we can keep it in the template for visibility. Feel | ||
// free to delete this parameter in your app if you're not using it! | ||
// eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
loadContext: AppLoadContext | ||
) { | ||
return isbot(request.headers.get("user-agent") || "") | ||
? handleBotRequest( | ||
request, | ||
responseStatusCode, | ||
responseHeaders, | ||
remixContext | ||
) | ||
: handleBrowserRequest( | ||
request, | ||
responseStatusCode, | ||
responseHeaders, | ||
remixContext | ||
); | ||
} | ||
|
||
function handleBotRequest( | ||
request: Request, | ||
responseStatusCode: number, | ||
responseHeaders: Headers, | ||
remixContext: EntryContext | ||
) { | ||
return new Promise((resolve, reject) => { | ||
let shellRendered = false; | ||
const { pipe, abort } = renderToPipeableStream( | ||
<RemixServer | ||
context={remixContext} | ||
url={request.url} | ||
abortDelay={ABORT_DELAY} | ||
/>, | ||
{ | ||
onAllReady() { | ||
shellRendered = true; | ||
const body = new PassThrough(); | ||
const stream = createReadableStreamFromReadable(body); | ||
|
||
responseHeaders.set("Content-Type", "text/html"); | ||
|
||
resolve( | ||
new Response(stream, { | ||
headers: responseHeaders, | ||
status: responseStatusCode, | ||
}) | ||
); | ||
|
||
pipe(body); | ||
}, | ||
onShellError(error: unknown) { | ||
reject(error); | ||
}, | ||
onError(error: unknown) { | ||
responseStatusCode = 500; | ||
// Log streaming rendering errors from inside the shell. Don't log | ||
// errors encountered during initial shell rendering since they'll | ||
// reject and get logged in handleDocumentRequest. | ||
if (shellRendered) { | ||
console.error(error); | ||
} | ||
}, | ||
} | ||
); | ||
|
||
setTimeout(abort, ABORT_DELAY); | ||
}); | ||
} | ||
|
||
function handleBrowserRequest( | ||
request: Request, | ||
responseStatusCode: number, | ||
responseHeaders: Headers, | ||
remixContext: EntryContext | ||
) { | ||
return new Promise((resolve, reject) => { | ||
let shellRendered = false; | ||
const { pipe, abort } = renderToPipeableStream( | ||
<RemixServer | ||
context={remixContext} | ||
url={request.url} | ||
abortDelay={ABORT_DELAY} | ||
/>, | ||
{ | ||
onShellReady() { | ||
shellRendered = true; | ||
const body = new PassThrough(); | ||
const stream = createReadableStreamFromReadable(body); | ||
|
||
responseHeaders.set("Content-Type", "text/html"); | ||
|
||
resolve( | ||
new Response(stream, { | ||
headers: responseHeaders, | ||
status: responseStatusCode, | ||
}) | ||
); | ||
|
||
pipe(body); | ||
}, | ||
onShellError(error: unknown) { | ||
reject(error); | ||
}, | ||
onError(error: unknown) { | ||
responseStatusCode = 500; | ||
// Log streaming rendering errors from inside the shell. Don't log | ||
// errors encountered during initial shell rendering since they'll | ||
// reject and get logged in handleDocumentRequest. | ||
if (shellRendered) { | ||
console.error(error); | ||
} | ||
}, | ||
} | ||
); | ||
|
||
setTimeout(abort, ABORT_DELAY); | ||
}); | ||
} |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We should probably use an os agnostic package, while none of us use windows there might be some external users or fork/clone this.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Resolved made it agnostic.