Merge pull request #9 from metaory/master

🔥 Secret Gist support + Refactors

.github/icon.xc

@@ -0,0 +1,70 @@
+#
+#  ▀▄▀ █ █▀▀ █▀█
+#  █░█ █ █▄▄ █▄█
+#  ▁▁▁▁▁▁▁▁v0.7▁
+#
+# https://github.com/metaory/xico
+# ###############################
+
+set d 0
+set o 0
+
+set r 50
+set ff monospace
+set fw bold
+set fs 8em
+set s 500
+# set bg #222233
+set fg #DD0077;
+
+put 􀑇  public/icon.png
+# set x 50
+# set y 50
+# set xbg #DD6688
+# set xbo 0
+
+#
+# ╭────────────────────┬────────┬────────────────┬───────────────────────────────────────────────────────────────────────────────────╮
+# │ option             │ alias  │ default        │ type                                                                              │
+# ╞════════════════════╪════════╪════════════════╪═══════════════════════════════════════════════════════════════════════════════════╡
+# │ r_fill             │ bg     │ black          │ [ <hex-color> | <named-color> | <rgb()> | <rgba()> | <hsl()> <hsla()> | <lab()> ] │
+# │ r_width            ┆ w      ┆ 100            ┆ [ auto | <length> | <percentage> ]                                                │
+# │ r_height           │ h      │ 100            │ [ auto | <length> | <percentage> ]                                                │
+# │ r_opacity          ┆ o      ┆ 0.5            ┆ [ <number>(0,1) | <percentage> ]                                                  │
+# │ r_rx               │ r      │ 25             │ [ <length> | <percentage> | auto ]                                                │
+# │ r_ry               ┆ r      ┆ 25             ┆ [ <length> | <percentage> | auto ]                                                │
+# │ r_x                │        │ 0              │ [ <length> | <percentage> ]                                                       │
+# │ r_y                ┆        ┆ 0              ┆ [ <length> | <percentage> ]                                                       │
+# ├╌─╌╌╌─╌╌─╌─╌╌╌╌─┄╌──┼─╌╌─╌─╌─┼─╌╌─╌╌─╌─╌──────┼─╌╌─╌─╌─╌╌─╌─╌─╌╌─╌─╌──╌╌─╌─╌─╌╌─╌─╌──╌╌─╌─╌──╌╌─╌─╌─╌╌─╌─╌──╌╌─╌─╌─╌╌─╌─╌─────────┤
+# │ t_fill             │ fg     │ #3311FF        │ [ <hex-color> | <named-color> | <rgb()> | <rgba()> | <hsl()> <hsla()> | <lab()> ] │
+# │ t_font-family      ┆ ff     ┆ monospace      ┆ [ <family-name> | <generic-family> ]                                              │
+# │ t_font-weight      │ fw     │ bold           │ [ <normal | bold | bolder | lighter | <number> ]                                  │
+# │ t_font-size        ┆ fs     ┆ 8em            ┆ [ <absolute-size> | <relative-size> | <length-percentage> ]                       │
+# │ t_rotate           │ rotate │ 0              │ [ auto | auto-reverse | <number> ]                                                │
+# │ t_transform        │        │ translate(0,0) │ [ <transform-function> ]                                                          │
+# │ t_transform-origin ┆        ┆ center         ┆ [ <transform-origin> ]                                                            ┆
+# │ t_dx               │        │ 0              │ [ <length-percentage> | <number> ]                                                │
+# │ t_dy               ┆        ┆ 3.5            ┆ [ <length-percentage> | <number> ]                                                │
+# │ t_x                │ x      │ 50             │ [ <length> | <percentage> ]                                                       │
+# │ t_y                ┆ y      ┆ 50             ┆ [ <length> | <percentage> ]                                                       │
+# ╰────────────────────┴────────┴────────────────┴───────────────────────────────────────────────────────────────────────────────────╯
+# ╭─────────────────────┬───────┬─────────┬──────────────────────────────────╮
+# │ option              │ alias │ default │ type                             │
+# ╞═════════════════════╪═══════╪═════════╪══════════════════════════════════╡
+# │ background          ╎ xbg   ╎ black   ╎ [ <color> ]                      │
+# │ background-opacity  ╎ xbo   ╎ 0       ╎ [ <number>(0,1) | <percentage> ] │
+# │ size                ╎ s     ╎ 500     ╎ [ <number> ]                     │
+# │ delay               ╎ d     ╎ 3       ╎ [ <number> ]                     │
+# ╰─────────────────────┴───────┴─────────┴──────────────────────────────────╯
+
+##########################################################
+#### 💡 Check complete template templates/default.xc   ###
+##########################################################
+#
+## copy the starter template and start there
+#
+# cp templates/starter.xc <path>
+# xico -t starter.xc
+###########################################################
+
+# vim: ft=config:syntax=spec:commentstring=#%s:nowrap:nornu:nonu:nospell:nocul:nocuc

.prettierrc.toml

@@ -0,0 +1,7 @@
+experimentalTernaries = false
+semi = false
+singleAttributePerLine = true
+printWidth = 100
+singleQuote = true
+trailingComma = "es5"
+arrowParens = "avoid"

LICENSE.md

@@ -1,6 +1,9 @@
 MIT License
 
-Copyright (c) 2022 Drake Axelrod
+Copyright © 2024-present metaory <metaory@gmail.com>
+
+Copyright © 2021-2023 Drake Axelrod <drake@draxel.io>
+
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,6 +1,48 @@
-# [JSON Resume as a Service](https://resume-service.vercel.app)
 
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FDrakeAxelrod%2Fjson-resume-service)
+<div align="center">
+ <table>
+   <tr>
+     <td valign="center">
+        <img alt="icon" height="50" src="https://raw.githubusercontent.com/metaory/jsonresume-service/master/public/icon.png">
+     </td>
+     <td valign="center">
+       <h2>JSONResume as a Service</h2>
+     </td>
+   </tr>
+ </table>
+</div>
+
+<div align="center">
+  <img alt="social" src="https://raw.githubusercontent.com/metaory/jsonresume-service/master/.github/assets/social.png">
+  <h4><a href="https://jsonresume-service.vercel.app/">jsonresume-service.vercel.app</a></h4>
+</div>
+
+## 🔥 Refactors + Secret Gists
+
+#### Secret Gist
+
+> [!Tip]
+> For private secret gists
+>
+> - [localhost:3000/gist/<gist_id>](http://localhost:3000/gist/<gist_id>)
+> the first json file from that secret gist will be attempted
+> the file can be named anything `my-private.json`
+>
+> eg: [jsonresume-service.vercel.app/gist/6776c2096963f1ca8ddb1817c8674b93](https://jsonresume-service.vercel.app/gist/6776c2096963f1ca8ddb1817c8674b93)
+
+#### Public Gist
+
+> [!Tip]
+> For public gist `resume.json`
+>
+> - [localhost:3000/user/<username>](http://localhost:3000/<username>)
+> the user must have a public gist named `resume.json`
+>
+> eg: [jsonresume-service.vercel.app/user/drakeaxelrod](https://jsonresume-service.vercel.app/user/drakeaxelrod)
+
+---
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https//github.com/metaory/jsonresume-service)
 
 <p align="center">
 <img src="public/resume-service-image.png" alt="resume service example" />
@@ -136,13 +178,23 @@ The following is a basic schema:[^1]
 
 ## Why use this service?
 
-Because it allows you to provide resumes in various styles as a service. This means that you define one data file (a resume.json) and you upload it as a public gist to github. Then you can provide that information to this service which whill dynamically generate resumes according to compliant formatters. This means that you can create professional looking resumes within seconds after defining your json resume.
+Because it allows you to provide resumes in various styles as a service.
+This means that you define one data file (a resume.json) and you upload it as a public gist to github.
+
+> [!Tip]
+> use **secret gists**
+>
+> - the filename can be anything
+> - the first json file will be attempted
+
+Then you can provide that information to this service which will dynamically generate resumes according to compliant formatters.
+This means that you can create professional looking resumes within seconds after defining your json resume.
 
 ## Deploy your own
 
 You'll want to fork this repository and deploy your own resume generator service.
 
-1. Click the fork button at the top right of GitHub or just click this link [Fork](https://github.com/DrakeAxelrod/json-resume-service/fork)
+1. Click the fork button at the top right of GitHub or just click this link [Fork](https://github.com/metaory/jsonresume-service/fork)
 2. Clone your forked repository
 
 ```bash
@@ -152,54 +204,32 @@ git clone URL_OF_FORKED_REPO_HERE
 3. Change directory to your local copy of the forked repository
 
 ```bash
-cd resume-service
+cd jsonresume-service
 ```
 
 6. Run locally with the project locally
 
 ```bash
-yarn dev or npm run dev
+pnpm dev or npm run dev
 ```
 
 7. Visit [localhost:3000](http://localhost:3000)
    - if nothing happens, run
 
+
 ```bash
 npm i
-# or if you use yarn
-yarn
 ```
 
 7. Deploy to the cloud by running going to [Vercel](https://vercel.com/) and making an account if you don't have one or you another hosting service of your choice.
 
-## Authors
-
-- Drake Axelrod ([@drakeaxelrod](https://twitter.com/drakeaxelrod)) - [website](https://www.draxel.io)
-
-## Contributors
-
-<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
-<!-- prettier-ignore-start -->
-<!-- markdownlint-disable -->
-<table>
-  <tr>
-    <td align="center">
-      <a href="https://github.com/DrakeAxelrod">
-        <img src="https://avatars.githubusercontent.com/u/51012876?v=4" width="64px;" alt="Drake Axelrod" style="border-radius: 100%;"/>
-      </a>
-      <br />
-      <sub>
-        <b>Drake Axelrod</b>
-      </sub>
-    </td>
-  </tr>
-</table>
-
 ## License
 
-MIT © [Drake Axelrod](https://github.com/DrakeAxelrod)
+Copyright © 2024-present [metaory](https://github.com/metaory)
+
+Copyright © 2021-2023 [Drake Axelrod](https://github.com/drakeaxelrod)
 
-👉 [license](https://github.com/DrakeAxelrod/json-resume-service/blob/main/LICENSE.md)
+[MIT](LICENSE)
 
 ## Footer
 

components/help.tsx

@@ -0,0 +1,26 @@
+import Message from '@components/message'
+
+const tpl = (str: TemplateStringsArray, ...vars: string[]) => (<p key={Math.random()} > {
+  str.reduce((acc, cur, i) =>
+    [...acc, (<span key={`${cur}--${i}`} > {cur} <em> {vars[i]}</em> </span>)], [])
+}</p>)
+
+export default () => (<> {[
+  [
+    'secret',
+    tpl`It ${"must"} have a ${"json file"}`,
+    tpl`It ${"can"} be named ${"anything"}`,
+    tpl`The ${"first json file"} will be attempted`,
+  ],
+  [
+    'public',
+    tpl`It ${"must"} have a ${"json file"}`,
+    tpl`It ${"must"} be named ${'resume.json'}`,
+    tpl`The ${'resume.json'} will be attempted`,
+  ],
+].reduce((acc, [visibility, ...points], i) => [
+  ...acc,
+  (
+    <Message key={`${visibility}--${i}`} msg={visibility}>{points}</Message>
+  )
+], [])} </>)

components/loader.tsx

@@ -0,0 +1,3 @@
+import styles from '@styles/loader.module.scss'
+
+export default () => (<div className={styles.loader} />)

components/message.tsx

@@ -0,0 +1,15 @@
+import Link from 'next/link'
+
+import styles from '@styles/message.module.scss'
+
+const links = { public: '/user/<username>', secret: '/gist/<gist_id>' }
+export default ({ msg, children = [], ...etc }) => {
+  const link = links[msg]
+  return (
+    <Link className={styles.message} href={link ?? '/'} {...etc}>
+      <h3>{msg}</h3>
+      {children}
+      <h4>{link}</h4>
+    </Link>
+  )
+}

components/resume/ResumeHeader.tsx

@@ -1,5 +1,5 @@
 import { formatPhoneNumber, minimizeUrl, setHttps } from "@utils/string-parsers";
-import { CountryCode } from "libphonenumber-js";
+// import { CountryCode } from "libphonenumber-js";
 import { SectionTitle } from "./SectionTitle";
 import styles from "@styles/resume.module.scss";
 import { Exists } from "../Exists";
@@ -50,10 +50,7 @@ export const ResumeHeader: FC<ResumeHeaderProps> = ({ resume }) => {
         <Exists exists={resume.basics?.phone}>
           <span>
             <i id="icon" className={`${styles.icon} fas fa-phone`}></i>{" "}
-            {formatPhoneNumber(
-              resume.basics?.phone,
-              resume.basics?.location?.countryCode as CountryCode
-            )}
+            {formatPhoneNumber(resume.basics?.phone)}
           </span>
         </Exists>
         <Exists exists={resume.basics?.email}>
@@ -75,9 +72,8 @@ export const ResumeHeader: FC<ResumeHeaderProps> = ({ resume }) => {
                 id="icon"
                 target="_blank"
                 rel="noreferrer"
-                className={`${
-                  styles.icon
-                } fa fa-${profile.network?.toLowerCase()}`}
+                className={`${styles.icon
+                  } fa fa-${profile.network?.toLowerCase()}`}
                 href={`${profile.url}`}
                 aria-label={`${profile.network}`}
               ></a>{" "}

components/resume/index.tsx

@@ -1,4 +1,3 @@
-// import styles from "@styles/resume.module.scss";
 import { defaultOrder } from "@lib/constants";
 import { ResumeHeader } from "./ResumeHeader";
 import { Section } from "./Section";