Skip to content
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

Migrate theme onepage-plus #59

Merged

Conversation

alexanderdavide
Copy link
Contributor

@alexanderdavide alexanderdavide commented Dec 13, 2023

Hey,

as said in #36, I'd like to have onepage-plus back and thought I'd give it a shot.

I tried to copy your migration of theme 'flat' and also drew inspiration from the implementation of partials in theme 'full'.

Too, I made sure nobody pushes .pnpm-store.

I hope to soon be able to enjoy onepage-plus again.

Summary by CodeRabbit

  • New Features

    • Introduced a new resume theme 'onepage-plus' with enhanced formatting options.
    • Added a formatDate helper for improved date presentation in resumes.
  • Enhancements

    • Updated the API to support the new 'onepage-plus' theme.
    • Expanded the .gitignore and .npmignore files for better project hygiene.
  • Documentation

    • Enhanced the README with installation and development instructions.
  • Style

    • Implemented new CSS styles for better resume layout and printability.
  • Bug Fixes

    • Ensured that the awards section only displays when there are awards to show.
  • Refactor

    • Modularized resume sections like work, education, skills, etc., for clearer structure and maintenance.

Copy link

changeset-bot bot commented Dec 13, 2023

⚠️ No Changeset found

Latest commit: 76f8a00

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Copy link

vercel bot commented Dec 13, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
jsonresume-org-homepage ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 14, 2023 6:15am
jsonresume-org-registry ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 14, 2023 6:15am

Copy link

vercel bot commented Dec 13, 2023

@alexanderdavide is attempting to deploy a commit to the JSON Resume Team on Vercel.

A member of the Team first needs to authorize it.

Copy link
Contributor

coderabbitai bot commented Dec 13, 2023

Walkthrough

The changes involve updating a project to include a new resume theme called onepage-plus. This includes adding new template partials for various resume sections, a helper function for date formatting, and CSS styles. The .gitignore and .npmignore files are updated to exclude unnecessary files from version control and npm packaging, respectively.

Changes

File Path Change Summary
.gitignore Added .pnpm-store directory to ignore list.
apps/registry/pages/api/formatters/template.js Imported onepageplus and updated THEMES object to include 'onepage-plus'.
packages/jsonresume-theme-onepage-plus/.gitignore
packages/jsonresume-theme-onepage-plus/.npmignore
Ignored node_modules/, public/, npm-debug.log, and .DS_Store. Updated to exclude specific files/directories.
packages/jsonresume-theme-onepage-plus/README.md Updated with installation and development instructions.
packages/jsonresume-theme-onepage-plus/index.js Added formatDate helper and updated render function to use css and resume.
packages/jsonresume-theme-onepage-plus/partials/...
packages/jsonresume-theme-onepage-plus/partials/index.js
Added new default exports for various resume section templates. Added module import/export block for resume sections.
packages/jsonresume-theme-onepage-plus/resume.js Added export default statement for HTML resume template.
packages/jsonresume-theme-onepage-plus/style.js Added new CSS style definitions and media queries.

Related issues

  • bring back onepage theme #30: The addition of the onepage-plus theme in this PR seems to address the request to bring back the onepage theme, as it likely represents an enhanced version of the original theme.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on X ?


Tips

Chat with CodeRabbit Bot (@coderabbitai)

  • You can reply to a review comment made by CodeRabbit.
  • You can tag CodeRabbit on specific lines of code or files in the PR by tagging @coderabbitai in a comment.
  • You can tag @coderabbitai in a PR comment and ask one-off questions about the PR and the codebase. Use quoted replies to pass the context for follow-up questions.

CodeRabbit Commands (invoked as PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • The JSON schema for the configuration file is available here.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Review Status

Actionable comments generated: 10

Configuration used: CodeRabbit UI

Commits Files that changed from the base of the PR and between faadbbe and d0b7c75.
Files ignored due to filter (6)
  • apps/registry/package.json
  • packages/jsonresume-theme-onepage-plus/package-lock.json
  • packages/jsonresume-theme-onepage-plus/package.json
  • packages/jsonresume-theme-onepage-plus/resume.json
  • packages/jsonresume-theme-onepage-plus/resume.pdf
  • pnpm-lock.yaml
Files selected for processing (21)
  • .gitignore (1 hunks)
  • apps/registry/pages/api/formatters/template.js (2 hunks)
  • packages/jsonresume-theme-onepage-plus/.gitignore (1 hunks)
  • packages/jsonresume-theme-onepage-plus/.npmignore (1 hunks)
  • packages/jsonresume-theme-onepage-plus/README.md (1 hunks)
  • packages/jsonresume-theme-onepage-plus/index.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/awards.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/basics.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/certificates.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/education.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/index.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/interests.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/languages.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/projects.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/publications.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/references.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/skills.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/volunteer.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/work.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/resume.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/style.js (1 hunks)
Files skipped from review due to trivial changes (10)
  • .gitignore
  • packages/jsonresume-theme-onepage-plus/.gitignore
  • packages/jsonresume-theme-onepage-plus/.npmignore
  • packages/jsonresume-theme-onepage-plus/README.md
  • packages/jsonresume-theme-onepage-plus/partials/education.js
  • packages/jsonresume-theme-onepage-plus/partials/index.js
  • packages/jsonresume-theme-onepage-plus/partials/interests.js
  • packages/jsonresume-theme-onepage-plus/partials/languages.js
  • packages/jsonresume-theme-onepage-plus/resume.js
  • packages/jsonresume-theme-onepage-plus/style.js
Additional comments: 16
apps/registry/pages/api/formatters/template.js (5)
  • 4-4: The import statement for onepageplus has been added correctly.

  • 31-31: The THEMES object has been updated to include the onepage-plus theme correctly.

  • 28-34: The getTheme function correctly handles the retrieval of themes, including the newly added onepage-plus theme.

  • 28-34: The format function correctly uses the getTheme function to render the resume HTML with the specified theme, defaulting to 'elegant' if none is provided.

  • 28-34: The exports object is correctly set up to export the format function.

packages/jsonresume-theme-onepage-plus/index.js (2)
  • 34-42: The render function has been updated to include css and resume properties when compiling the template. This change aligns with the PR objectives to reintroduce the onepage-plus theme with updated functionality.

  • 45-47: The module exports the render function, which is consistent with the PR objectives to update the exported public entity for the onepage-plus theme.

packages/jsonresume-theme-onepage-plus/partials/basics.js (1)
  • 1-51: The template uses Handlebars syntax correctly and is well-structured for readability and maintainability. Ensure that the id attributes are unique if this template is included multiple times in a single document.
packages/jsonresume-theme-onepage-plus/partials/projects.js (5)
  • 1-40: The template uses Handlebars syntax to iterate over resume.projects and conditionally render project details. Ensure that the resume.projects data is properly sanitized before being rendered to prevent XSS attacks, as the template directly injects data into the HTML.

  • 22-22: Verify that the url property of each project is sanitized to prevent potential security vulnerabilities such as XSS attacks. If the url is user-supplied data, it should be encoded or validated to ensure it is a safe URL.

  • 28-34: The template checks if highlights.length is truthy before iterating over highlights. This is good practice to prevent rendering empty lists. However, ensure that the highlights array is always an array to avoid runtime errors when calling .length on undefined or null.

  • 16-20: Ensure that startDate and endDate are properly sanitized to prevent XSS attacks. If these dates are user-supplied, they should be encoded or validated to ensure they do not contain malicious scripts.

  • 35-35: The use of {{#unless @last}} to conditionally render a separator is a good practice to avoid adding unnecessary markup after the last item in a list.

packages/jsonresume-theme-onepage-plus/partials/skills.js (1)
  • 1-26: The template for the skills section appears to be correctly structured with proper use of Handlebars syntax for conditionals and loops. Ensure that the data passed to this template is properly sanitized to prevent XSS vulnerabilities, although Handlebars does provide default escaping. The use of conditionals to check for the existence of properties before rendering is a good practice and should help prevent rendering errors.
packages/jsonresume-theme-onepage-plus/partials/work.js (2)
  • 25-25: Verify that highlights is always an array before iterating over it to prevent runtime errors if highlights is not iterable.

  • 19-19: Ensure that the url is properly sanitized before being inserted into the href attribute to prevent XSS attacks.

Comment on lines +9 to +19
{{#if reference}}
<blockquote class="reference">
{{reference}}

{{/if}}
{{#if name}}
<div class="name">
— {{name}}
</div>
{{/if}}
</blockquote>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The blockquote tag should be closed properly regardless of the presence of the name field to ensure valid HTML structure.

  {{#if reference}}
  <blockquote class="reference">
    {{reference}}
  {{/if}}
+14:
  </blockquote>
  {{#if name}}
  <div class="name">
    — {{name}}
  </div>
  {{/if}}

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
{{#if reference}}
<blockquote class="reference">
{{reference}}
{{/if}}
{{#if name}}
<div class="name">
{{name}}
</div>
{{/if}}
</blockquote>
{{#if reference}}
<blockquote class="reference">
{{reference}}
</blockquote>
{{/if}}
{{#if name}}
<div class="name">
{{name}}
</div>
{{/if}}

Comment on lines +14 to +15
<span class='date'>
<span class='date'>{{date}}</span>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There seems to be redundant nesting of <span> tags with the class 'date'. This could lead to incorrect styling or unexpected layout issues.

- <span class='date'>
-   <span class='date'>{{date}}</span>
- </span>
+ <span class='date'>{{date}}</span>

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
<span class='date'>
<span class='date'>{{date}}</span>
<span class='date'>{{date}}</span>

Comment on lines +1 to +36
export default `{{#if resume.publications.length}}
<div class='sectionLine'></div>
<div id='publications'>
<div class='sectionName'>
<span>PUBLICATIONS</span>
</div>
<div class='sectionContent'>
{{#each resume.publications}}
<div class='blockHeader'>
<span class='title'>
{{#if name}}{{name}}{{/if}}
</span>
{{#if releaseDate}}
<span class='date'>
<span class='releaseDate'>{{formatDate releaseDate}}</span>
</span>
{{/if}}
</div>
{{#if publisher}}
<div class="publisher">{{publisher}}</div>
{{/if}}
{{#if url}}
<div class='url'>
<a href='{{url}}'>{{url}}</a>
</div>
{{/if}}
{{#if summary}}
<div class="summary">
<p>{{summary}}</p>
</div>
{{/if}}
{{#unless @last}}<div class='separator'></div>{{/unless}}
{{/each}}
</div>
</div>
{{/if}}`;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The template for the publications section is well-structured and makes good use of conditional rendering to ensure only available data is displayed. The use of the formatDate helper function on line 15 is consistent with the PR's objectives and helps maintain a clean template. Consider adding a message or fallback content when resume.publications is empty or not present to improve user experience.

</span>
{{/location}}
</div>
{{#if profiles.length}}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider verifying that profiles is an array before checking its length to avoid potential runtime errors if profiles is not defined or not an array.

- {{#if profiles.length}}
+ {{#if (isArray profiles) && profiles.length}}

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
{{#if profiles.length}}
{{#if (isArray profiles) && profiles.length}}

Comment on lines +15 to +32
Handlebars.registerHelper('formatDate', function (dateString) {
let dateStrArr = dateString.split('-');

if (dateStrArr[0] && dateStrArr[1] && dateStrArr[2])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
day: 'numeric',
});

if (dateStrArr[0] && dateStrArr[1])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
});

return dateStrArr;
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The formatDate helper function has been updated to handle different date formats. Ensure that this function correctly handles all expected date string formats and consider adding error handling for invalid date strings to avoid potential runtime errors.

Handlebars.registerHelper('formatDate', function (dateString) {
+  if (!/^\d{4}-\d{2}-\d{2}$/.test(dateString) && !/^\d{4}-\d{2}$/.test(dateString)) {
+    throw new Error('Invalid date format');
+  }
  let dateStrArr = dateString.split('-');
  // ... rest of the function
});

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
Handlebars.registerHelper('formatDate', function (dateString) {
let dateStrArr = dateString.split('-');
if (dateStrArr[0] && dateStrArr[1] && dateStrArr[2])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
day: 'numeric',
});
if (dateStrArr[0] && dateStrArr[1])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
});
return dateStrArr;
});
Handlebars.registerHelper('formatDate', function (dateString) {
if (!/^\d{4}-\d{2}-\d{2}$/.test(dateString) && !/^\d{4}-\d{2}$/.test(dateString)) {
throw new Error('Invalid date format');
}
let dateStrArr = dateString.split('-');
if (dateStrArr[0] && dateStrArr[1] && dateStrArr[2])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
day: 'numeric',
});
if (dateStrArr[0] && dateStrArr[1])
return new Date(dateString).toLocaleDateString('en', {
month: 'short',
year: 'numeric',
});
return dateStrArr;
});

{{#if position}} | <span class="position">{{position}}</span>{{/if}}
{{#if startDate}}
<span class='date'>
{{#if startDate}}{{startDate}}{{/if}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider simplifying the Handlebars expression for startDate since the {{#if startDate}} condition is already being checked, the inner {{#if startDate}} is redundant.

- {{#if startDate}}{{startDate}}{{/if}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}
+ {{startDate}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
{{#if startDate}}{{startDate}}{{/if}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}
{{startDate}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}

<span class='title'>{{#if position}}{{position}}{{/if}}</span>{{#if organization}} | {{organization}}{{/if}}
{{#if startDate}}
<span class='date'>
{{#if startDate}}{{startDate}}{{/if}} &mdash; {{#if endDate}}{{endDate}}{{else}}Present{{/if}}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider using the new formatDate helper function to format startDate and endDate for consistency with other parts of the application that may use this helper.

Comment on lines +16 to +17
{{#if url}}
<div class='url'><a href='{{url}}'>{{url}}</a></div>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ensure that URLs are sanitized before being rendered to prevent potential XSS attacks. If the url is not sanitized elsewhere in the code, it should be handled here.

Comment on lines +24 to +29
{{#if highlights.length}}
<ul class='highlights'>
{{#each highlights}}
<li>{{.}}</li>
{{/each}}
</ul>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similar to URLs, ensure that the highlights content is sanitized to prevent XSS vulnerabilities.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Review Status

Actionable comments generated: 1

Configuration used: CodeRabbit UI

Commits Files that changed from the base of the PR and between faadbbe and 76f8a00.
Files ignored due to filter (6)
  • apps/registry/package.json
  • packages/jsonresume-theme-onepage-plus/package-lock.json
  • packages/jsonresume-theme-onepage-plus/package.json
  • packages/jsonresume-theme-onepage-plus/resume.json
  • packages/jsonresume-theme-onepage-plus/resume.pdf
  • pnpm-lock.yaml
Files selected for processing (21)
  • .gitignore (1 hunks)
  • apps/registry/pages/api/formatters/template.js (2 hunks)
  • packages/jsonresume-theme-onepage-plus/.gitignore (1 hunks)
  • packages/jsonresume-theme-onepage-plus/.npmignore (1 hunks)
  • packages/jsonresume-theme-onepage-plus/README.md (1 hunks)
  • packages/jsonresume-theme-onepage-plus/index.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/awards.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/basics.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/certificates.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/education.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/index.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/interests.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/languages.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/projects.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/publications.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/references.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/skills.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/volunteer.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/partials/work.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/resume.js (1 hunks)
  • packages/jsonresume-theme-onepage-plus/style.js (1 hunks)
Files skipped from review due to trivial changes (15)
  • .gitignore
  • packages/jsonresume-theme-onepage-plus/.gitignore
  • packages/jsonresume-theme-onepage-plus/.npmignore
  • packages/jsonresume-theme-onepage-plus/README.md
  • packages/jsonresume-theme-onepage-plus/partials/awards.js
  • packages/jsonresume-theme-onepage-plus/partials/basics.js
  • packages/jsonresume-theme-onepage-plus/partials/education.js
  • packages/jsonresume-theme-onepage-plus/partials/index.js
  • packages/jsonresume-theme-onepage-plus/partials/interests.js
  • packages/jsonresume-theme-onepage-plus/partials/languages.js
  • packages/jsonresume-theme-onepage-plus/partials/skills.js
  • packages/jsonresume-theme-onepage-plus/partials/volunteer.js
  • packages/jsonresume-theme-onepage-plus/partials/work.js
  • packages/jsonresume-theme-onepage-plus/resume.js
  • packages/jsonresume-theme-onepage-plus/style.js
Files skipped from review as they are similar to previous changes (5)
  • apps/registry/pages/api/formatters/template.js
  • packages/jsonresume-theme-onepage-plus/index.js
  • packages/jsonresume-theme-onepage-plus/partials/projects.js
  • packages/jsonresume-theme-onepage-plus/partials/publications.js
  • packages/jsonresume-theme-onepage-plus/partials/references.js

Comment on lines +15 to +17
<span class='date'>
<span class='date'>{{formatDate date}}</span>
</span>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The nested span with the class 'date' is still present, which could lead to styling conflicts or semantic HTML issues. Consider removing the outer span to keep the markup clean.

-			<span class='date'>
				<span class='date'>{{formatDate date}}</span>
-			</span>

Committable suggestion

IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
<span class='date'>
<span class='date'>{{formatDate date}}</span>
</span>
<span class='date'>{{formatDate date}}</span>

@levino levino added this pull request to the merge queue Dec 14, 2023
Merged via the queue into jsonresume:master with commit 63c57b7 Dec 14, 2023
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants