[to test AI review bots] Add editor app for editing blogs and job posts (#880)#7
Conversation
|
This is a benchmark review for experiment This pull request was cloned from Experiment configurationreview_config:
# User configuration for the review
# - benchmark - use the user config from the benchmark reviews
# - <value> - use the value directly
user_review_config:
enable_ai_review: true
enable_rule_comments: false
enable_complexity_comments: benchmark
enable_security_comments: benchmark
enable_tests_comments: benchmark
enable_comment_suggestions: benchmark
enable_pull_request_summary: benchmark
enable_review_guide: benchmark
enable_approvals: true
ai_review_config:
# The model responses to use for the experiment
# - benchmark - use the model responses from the benchmark reviews
# - llm - call the language model to generate responses
model_responses:
comments_model: benchmark
comment_validation_model: benchmark
comment_suggestion_model: benchmark
complexity_model: benchmark
security_model: benchmark
tests_model: benchmark
pull_request_summary_model: benchmark
review_guide_model: benchmark
overall_comments_model: benchmark
# The pull request dataset to run the experiment on
pull_request_dataset:
- https://github.com/bluedotimpact/bluedot/pull/909
# Questions to ask to label the review comments
review_comment_labels: []
# - label: correct
# question: Is this comment correct?
# Benchmark reviews generated by running
# python -m scripts.experiment benchmark <experiment_name>
benchmark_reviews: []
|
SourceryAI
left a comment
There was a problem hiding this comment.
Hey @brendanator - I've reviewed your changes - here's some feedback:
- In apps/editor/src/pages/api/jobs/[slug]/index.ts, the PUT response returns { blog: updatedJob } instead of { job: updatedJob }, which may cause confusion or bugs in consumers expecting a 'job' key.
- Consider extracting the Airtable base and table IDs in apps/editor/src/lib/api/db/tables.ts to environment variables or a shared config to avoid hardcoding sensitive or environment-specific values.
Here's what I looked at during the review
- 🟡 General issues: 5 issues found
- 🟢 Security: all looks good
- 🟢 Testing: all looks good
- 🟢 Documentation: all looks good
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
| const upload = (file: File) => { | ||
| return new Promise<UploaderData>((resolve) => { | ||
| const reader = new FileReader(); | ||
| reader.addEventListener('load', () => { |
There was a problem hiding this comment.
suggestion: Consider handling FileReader error events during file uploads.
Attach an 'error' event listener to reject the promise on read failures and improve upload resiliency.
Suggested implementation:
return new Promise<UploaderData>((resolve, reject) => { const reader = new FileReader();
reader.addEventListener('error', () => {
reject(new Error('FileReader failed to read file'));
});
reader.addEventListener('load', () => {
uploadFile(reader.result as ArrayBuffer, file.type).then(({ url }) => {
resolve({
name: '',
type: file.type,
size: file.size,
url,
});
});
}, false);| const handleBeforeUnload = (e: BeforeUnloadEvent) => { | ||
| if (hasUnsavedChanges) { | ||
| e.preventDefault(); | ||
| } | ||
| }; |
There was a problem hiding this comment.
suggestion (bug_risk): Set returnValue on beforeunload events to ensure browsers show the unsaved changes prompt.
Some browsers ignore preventDefault() alone; you must explicitly set e.returnValue (e.g., "" ) to trigger the prompt.
| const handleBeforeUnload = (e: BeforeUnloadEvent) => { | |
| if (hasUnsavedChanges) { | |
| e.preventDefault(); | |
| } | |
| }; | |
| const handleBeforeUnload = (e: BeforeUnloadEvent) => { | |
| if (hasUnsavedChanges) { | |
| e.preventDefault(); | |
| e.returnValue = ""; | |
| } | |
| }; |
| }); | ||
| return { | ||
| type: 'success' as const, | ||
| blog: updatedJob, |
There was a problem hiding this comment.
issue: Return a property named 'job' instead of 'blog' for the job update response.
Use 'job' to match the endpoint’s type definition and prevent consumer confusion.
| .replace( | ||
| /!\[[^\]]*\]\((?<filename>.*?)(?="|\))(?<optionalpart>".*")?\)/g, | ||
| (match: string, filename: string) => `<Embed url="${filename.trim()}" />\n`, |
There was a problem hiding this comment.
question (bug_risk): Review the regex callback parameters for embed transformations.
Use the callback’s groups property to access both filename and optionalpart, ensuring all parts are handled.
|
|
||
| ## Deployment | ||
|
|
||
| This app is deployed onto the K8s cluster as a standard Next.js app in docker. |
There was a problem hiding this comment.
suggestion (typo): Capitalize 'Docker' as it is a proper noun.
Capitalize “docker” to “Docker” in that sentence.
| This app is deployed onto the K8s cluster as a standard Next.js app in docker. | |
| This app is deployed onto the K8s cluster as a standard Next.js app in Docker. |
There was a problem hiding this comment.
Caution
Changes requested ❌
Reviewed everything up to f7c59e6 in 2 minutes and 13 seconds. Click for details.
- Reviewed
1450lines of code in40files - Skipped
2files when reviewing. - Skipped posting
8draft comments. View those below. - Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.
1. apps/editor/src/pages/api/jobs/[slug]/index.ts:55
- Draft comment:
Return object key mismatch: in PUT case, use 'job' instead of 'blog'. - Reason this comment was not posted:
Marked as duplicate.
2. apps/editor/package.json:19
- Draft comment:
Avoid using '*' for dependency versions; specify explicit version ranges to prevent unexpected breaking changes. - Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 20% vs. threshold = 50% While using "" for dependencies can be risky, this appears to be an internal package within a monorepo (given the @bluedot scope and other similar internal dependencies). In monorepos, it's common practice to use "" for internal package dependencies to ensure you're always using the latest version. The comment seems to be applying a general best practice without considering the monorepo context. The comment could be correct if this isn't actually a monorepo setup, or if there's a specific reason to pin internal package versions in this project. The presence of multiple @bluedot/* packages and the consistent use of "" for internal dependencies strongly suggests this is a monorepo where "" is the intended version specifier. The comment should be deleted as it's suggesting a change that goes against common monorepo practices and the apparent intentional pattern in this codebase.
3. apps/editor/src/components/MarkdownEditor.tsx:120
- Draft comment:
The 'Insert image' toolbar button triggers setImage with an empty src; consider integrating a file-selection prompt or clearer upload flow. - Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 10% vs. threshold = 50% The comment suggests there's an issue with the empty src, but looking at the full implementation, this appears to be handled by the Uploader component. The Uploader is properly configured to handle file selection and uploading. The empty setImage call is likely just a placeholder that gets filled in by the Uploader's functionality. I could be wrong about how the Uploader interacts with the setImage call. Maybe these are separate flows that don't work together. The presence of the configured Uploader extension with detailed file handling logic strongly suggests this is the intended flow for image uploads. The empty setImage is likely part of this flow. The comment should be deleted as it appears to misunderstand the implementation. The image upload flow is actually handled by the Uploader component.
4. apps/editor/src/pages/api/jobs/[slug]/index.ts:55
- Draft comment:
Returned property key is 'blog' in the PUT case; it should be 'job' to match the expected response type. - Reason this comment was not posted:
Marked as duplicate.
5. apps/editor/src/pages/api/blogs/[slug]/index.ts:30
- Draft comment:
TODO: Remove the unnecessary cast used in the filterByFormula when array support is dropped; consider revisiting for improved type safety. - Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 10% vs. threshold = 50% The comment is redundant with the existing TODO comment. The suggestion to remove the cast without addressing the underlying array support issue could potentially cause type errors. Since this is a new file, the TODO comment was added intentionally as part of the implementation. Maybe the comment is trying to encourage addressing the TODO sooner rather than later? Perhaps the type safety concern is valid and worth highlighting separately from the TODO? The existing TODO already acknowledges the type safety issue, and removing the cast without addressing the underlying array support would be premature. The comment doesn't provide additional actionable value. Delete the comment as it's redundant with the existing TODO and its suggestion could introduce type errors if implemented without addressing the underlying array support issue.
6. apps/editor/README.md:11
- Draft comment:
Consider capitalizing 'docker' to 'Docker' for consistency with the product's branding. - Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 10% vs. threshold = 50% While technically correct about Docker's official branding, this is an extremely minor stylistic issue in a documentation file. It doesn't affect functionality, readability, or understanding. The rules specifically say not to make purely informative comments and to avoid unimportant issues. Docker's official branding could be considered important for professional documentation. Some might argue consistency matters for company image. While branding consistency is nice, this is an internal README file, not customer-facing documentation. The benefit is too minor to warrant a PR comment. This comment should be deleted as it's too minor and purely informative, not suggesting any meaningful code changes.
7. apps/editor/vitest.config.mjs:7
- Draft comment:
Typographical/lexical discrepancy: The comment on line 7 refers to "tippy.js", but the dependency specified in line 8 is '@syfxlin/tiptap-starter-kit'. Please verify whether the comment should match the actual dependency to avoid confusion. - Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 10% vs. threshold = 50% The comment is technically correct that there's a mismatch, but this seems like an overly pedantic point. The comment might be referring to tippy.js because it's a dependency within tiptap-starter-kit causing the issue. Without access to the full codebase and dependency tree, we can't know for sure. More importantly, this kind of minor comment text improvement doesn't affect functionality. The comment could be pointing out a genuine documentation issue that might confuse future developers about which package is actually causing the problem. While accurate documentation is good, this level of nitpicking about internal comments doesn't meet the bar of "clearly a code change required" and falls into the category of being unimportant. This comment should be deleted as it's overly pedantic and doesn't suggest an important or necessary code change.
8. libraries/ui/src/default-config/tailwind.css:139
- Draft comment:
Typo: 'psuedoelement' should be corrected to 'pseudoelement' for clarity. - Reason this comment was not posted:
Comment was not on a location in the diff, so it can't be submitted as a review comment.
Workflow ID: wflow_ebAkicLzHOAHC12T
You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.
| useEffect(() => { | ||
| const handleBeforeUnload = (e: BeforeUnloadEvent) => { | ||
| if (hasUnsavedChanges) { | ||
| e.preventDefault(); |
There was a problem hiding this comment.
Consider setting e.returnValue in the beforeunload handler for better browser support.
| e.preventDefault(); | |
| e.returnValue = ''; |
| }); | ||
| return { | ||
| type: 'success' as const, | ||
| blog: updatedJob, |
There was a problem hiding this comment.
Typographical Error: The returned object in the PUT case uses the property blog (line 56) instead of job as defined in the response type and the GET case. This inconsistency should be corrected to maintain consistent naming across the endpoint responses.
| blog: updatedJob, | |
| job: updatedJob, |
User description
Important
Introduces a new editor app for managing blogs and job posts with Markdown editing, Airtable integration, and deployment configuration.
editorapp for managing blogs and job posts with Markdown editing and image upload (MarkdownEditor.tsx,BodyEditor.tsx).index.tsinapi/blogsandapi/jobs).presigned-upload.ts).Dockerfile,serviceDefinitions.ts)..env.local.template,.env.test).tailwind.css,globals.css).MarkdownEditor(MarkdownEditor.test.tsx,MarkdownEditor.stories.tsx).status.test.ts).README.md).This description was created by
for f7c59e6. You can customize this summary. It will automatically update as commits are pushed.
CodeAnt-AI Description
editorapp for managing and editing blogs and job postings, including all core pages, API routes, and components.This PR introduces a full-featured editor app for BlueDot staff to manage content, including a custom Markdown editor with image upload, Airtable integration, and all necessary infrastructure for deployment and testing. It also improves code sharing and styling consistency across the codebase.
Changes walkthrough
23 files
MarkdownEditor.tsx
Add image upload and embed support to MarkdownEditor componentapps/editor/src/components/MarkdownEditor.tsx
uploadFileprop.MarkdownEditorPropstype.BodyEditor.tsx
Add BodyEditor component with file upload and save logicapps/editor/src/components/BodyEditor.tsx
BodyEditorcomponent for editing and saving markdowncontent.
BaseLayout.tsx
Add BaseLayout component with navigationapps/editor/src/components/BaseLayout.tsx
postings.
index.ts
Add API route for listing blog postsapps/editor/src/pages/api/blogs/index.ts
index.ts
Add API route for fetching and updating single blog postapps/editor/src/pages/api/blogs/[slug]/index.ts
index.ts
Add API route for listing job postingsapps/editor/src/pages/api/jobs/index.ts
index.ts
Add API route for fetching and updating single job postingapps/editor/src/pages/api/jobs/[slug]/index.ts
presigned-upload.ts
Add presigned S3 upload API route for file uploadsapps/editor/src/pages/api/presigned-upload.ts
uploads.
status.ts
Add status API endpointapps/editor/src/pages/api/status.ts
index.tsx
Add blog posts listing page with edit linksapps/editor/src/pages/blogs/index.tsx
[slug].tsx
Add blog post editor pageapps/editor/src/pages/blogs/[slug].tsx
index.tsx
Add job postings listing page with edit linksapps/editor/src/pages/jobs/index.tsx
[slug].tsx
Add job posting editor pageapps/editor/src/pages/jobs/[slug].tsx
index.tsx
Add home page redirect to blogsapps/editor/src/pages/index.tsx
index.tsx
Add login redirect pageapps/editor/src/pages/login/index.tsx
oauth-callback.tsx
Add OAuth callback page for loginapps/editor/src/pages/login/oauth-callback.tsx
index.ts
Add AirtableTs database instanceapps/editor/src/lib/api/db/index.ts
tables.ts
Define Airtable schemas for blogs and job postingsapps/editor/src/lib/api/db/tables.ts
env.ts
Add environment variable validation for APIapps/editor/src/lib/api/env.ts
secrets.
makeApiRoute.ts
Add helper for authenticated API routesapps/editor/src/lib/api/makeApiRoute.ts
token verification.
_app.tsx
Add custom App component with layout and SSR configapps/editor/src/pages/_app.tsx
tailwind.css
Move prose utility styles to shared UI librarylibraries/ui/src/default-config/tailwind.css
globals.css
Remove prose utility styles from website globalsapps/website/src/globals.css
3 files
MarkdownEditor.test.tsx
Add unit tests for MarkdownEditor componentapps/editor/src/components/MarkdownEditor.test.tsx
actions.
MarkdownEditor.stories.tsx
Add Storybook stories for MarkdownEditor componentapps/editor/src/components/MarkdownEditor.stories.tsx
content.
status.test.ts
Add test for status API endpointapps/editor/src/pages/api/status.test.ts
12 files
next.config.js
Add Next.js configuration fileapps/editor/next.config.js
postcss.config.js
Add PostCSS configuration for Tailwind CSSapps/editor/postcss.config.js
globals.css
Add global CSS imports for Tailwind and typographyapps/editor/src/globals.css
package.json
Add package.json for editor app dependencies and scriptsapps/editor/package.json
the editor app.
tsconfig.json
Add TypeScript configuration for editor appapps/editor/tsconfig.json
vitest.config.mjs
Add Vitest configuration for editor appapps/editor/vitest.config.mjs
tiptap-starter-kit.
Dockerfile
Add Dockerfile for editor app deploymentapps/editor/Dockerfile
production.
.env.local.template
Add .env.local.template for environment variablesapps/editor/.env.local.template
.env.test
Add .env.test for test environment variablesapps/editor/.env.test
next-env.d.ts
Add Next.js type definitionsapps/editor/next-env.d.ts
serviceDefinitions.ts
Add Kubernetes service definition for bluedot-editor appapps/infra/src/k8s/serviceDefinitions.ts
bluedot-editorapp in Kubernetes.vitest.config.mjs
Simplify Vitest config for website appapps/website/vitest.config.mjs
tiptap-starter-kit.
1 files
README.md
Add README for editor app setup and deploymentapps/editor/README.md
app.
1 files
package.json
Remove markdown editor dependencies from website package.jsonapps/website/package.json
package.json.
💡 Usage Guide
Checking Your Pull Request
Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.
Talking to CodeAnt AI
Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:
This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.
Retrigger review
Ask CodeAnt AI to review the PR again, by typing:
Check Your Repository Health
To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.
Summary by Sourcery
Create a new editor app for managing blogs and job posts, providing a comprehensive content management interface with Markdown editing, file uploads, and Airtable integration
New Features:
Enhancements:
Deployment:
Documentation:
Tests:
Chores:
Summary by CodeRabbit
New Features
Bug Fixes
Documentation
Style
Chores
Refactor