@stats-forge/github-stats-forge-core 0.0.1

package/src/common/config.ts

@@ -0,0 +1,118 @@
+import { defaultFetch } from './http.js';
+import type { FetchLike } from './http.js';
+
+type Env = Record<string, string | undefined>;
+
+interface PersonalAccessToken {
+  /** Env variable the token came from — the retryer logs this name, never the value. */
+  name: string;
+  value: string;
+}
+
+/** Overrides for a {@link CardConfig}; the constructor defaults anything omitted. */
+interface CardConfigInit {
+  pats?: ReadonlyArray<PersonalAccessToken>;
+  usernameAllowlist?: ReadonlyArray<string> | undefined;
+  gistAllowlist?: ReadonlyArray<string> | undefined;
+  excludeRepositories?: ReadonlyArray<string>;
+  fetchMultiPageStars?: number;
+  fetch?: FetchLike;
+}
+
+/**
+ * @param value Comma-separated string.
+ * @returns Parsed string values.
+ */
+const parseCsv = (value: string | undefined): Array<string> | undefined =>
+  value ? value.split(',') : undefined;
+
+/**
+ * @param value Raw `FETCH_MULTI_PAGE_STARS` value.
+ * @returns Page limit: `"true"` means every page, a positive number caps the pages, anything else means one.
+ */
+const parseFetchMultiPageStars = (value: string | undefined): number => {
+  if (value === 'true') {
+    return Infinity;
+  }
+  const limit = Number(value);
+  return limit > 0 ? limit : 1;
+};
+
+/**
+ * @param env Environment variables to inspect.
+ * @returns Personal access tokens found in the environment.
+ */
+const parsePATsFromEnv = (env: Env): Array<PersonalAccessToken> =>
+  Object.keys(env)
+    .filter((key) => /PAT_\d*$/.exec(key))
+    .map((name) => ({ name, value: env[name] ?? '' }));
+
+/**
+ * Deployment-wide configuration for the card renderers.
+ *
+ * Immutable, and built by the host rather than read from the environment, so the
+ * library behaves identically under Node, in the browser and under vitest.
+ */
+export class CardConfig {
+  readonly pats: ReadonlyArray<PersonalAccessToken>;
+  /** Allowed usernames; `undefined` means no allowlist configured. */
+  readonly usernameAllowlist: ReadonlyArray<string> | undefined;
+  /** Allowed gist ids; `undefined` means no allowlist configured. */
+  readonly gistAllowlist: ReadonlyArray<string> | undefined;
+  readonly excludeRepositories: ReadonlyArray<string>;
+  /** Max pages of starred repos; `Infinity` means every page, `1` only the first. */
+  readonly fetchMultiPageStars: number;
+  /** Transport every fetcher sends through; defaults to `globalThis.fetch`. */
+  readonly fetch: FetchLike;
+
+  constructor(init: CardConfigInit = {}) {
+    this.pats = init.pats ?? [];
+    this.usernameAllowlist = init.usernameAllowlist;
+    this.gistAllowlist = init.gistAllowlist;
+    this.excludeRepositories = init.excludeRepositories ?? [];
+    this.fetchMultiPageStars = init.fetchMultiPageStars ?? 1;
+    this.fetch = init.fetch ?? defaultFetch;
+  }
+
+  /**
+   * @param env Environment variables to read — the host passes `process.env` or an equivalent.
+   * @returns Config for this deployment.
+   */
+  static fromEnv(env: Env): CardConfig {
+    return new CardConfig({
+      pats: parsePATsFromEnv(env),
+      usernameAllowlist: parseCsv(env['WHITELIST']),
+      gistAllowlist: parseCsv(env['GIST_WHITELIST']),
+      excludeRepositories: parseCsv(env['EXCLUDE_REPO']) ?? [],
+      fetchMultiPageStars: parseFetchMultiPageStars(env['FETCH_MULTI_PAGE_STARS']),
+    });
+  }
+
+  /**
+   * @param id Username or gist id being requested.
+   * @param kind Which allowlist applies.
+   * @returns Whether this deployment serves the id.
+   */
+  isAllowed(id: string, kind: 'username' | 'gist'): boolean {
+    const list = kind === 'gist' ? this.gistAllowlist : this.usernameAllowlist;
+    return list === undefined || list.includes(id);
+  }
+
+  /**
+   * @param overrides Fields to replace.
+   * @returns A copy with `overrides` applied — how a host swaps in a user's PAT per request.
+   */
+  with(overrides: CardConfigInit): CardConfig {
+    return new CardConfig({
+      pats: this.pats,
+      usernameAllowlist: this.usernameAllowlist,
+      gistAllowlist: this.gistAllowlist,
+      excludeRepositories: this.excludeRepositories,
+      fetchMultiPageStars: this.fetchMultiPageStars,
+      fetch: this.fetch,
+      ...overrides,
+    });
+  }
+}
+
+export type { PersonalAccessToken, CardConfigInit };

package/src/common/constants.ts

@@ -0,0 +1,12 @@
+import type { RepositoryAffiliation } from '../graphql/generated/common.js';
+
+/**
+ * Valid owner affiliations for GitHub API queries.
+ */
+const OWNER_AFFILIATIONS: Array<RepositoryAffiliation> = [
+  'OWNER',
+  'COLLABORATOR',
+  'ORGANIZATION_MEMBER',
+];
+
+export { OWNER_AFFILIATIONS };

package/src/common/date.ts

@@ -0,0 +1,34 @@
+/** A span between two dates, as GitHub's range arguments take it. */
+interface GitHubDateRange {
+  /** Start of the range, inclusive. */
+  from: Date;
+  /** End of the range, inclusive. */
+  to: Date;
+}
+
+/**
+ * Format a date as a GitHub `DateTime` scalar.
+ * Seconds precision, no milliseconds.
+ *
+ * @param date Date to format.
+ * @returns e.g. `2024-01-01T00:00:00Z`.
+ */
+const toGitHubDateTime = (date: Date): string => `${date.toISOString().slice(0, 19)}Z`;
+
+/**
+ * The full UTC span of a calendar year, both ends inclusive.
+ *
+ * The end matters to callers that would otherwise leave a range open:
+ * GitHub's `contributionsCollection` defaults `to` to one year after `from`,
+ * which pulls the next 1st of January into the year.
+ *
+ * @param year Four-digit year.
+ * @returns The range covering it.
+ */
+const getGitHubYearRange = (year: number): GitHubDateRange => ({
+  from: new Date(Date.UTC(year, 0, 1)),
+  to: new Date(Date.UTC(year, 11, 31, 23, 59, 59)),
+});
+
+export { getGitHubYearRange, toGitHubDateTime };
+export type { GitHubDateRange };

package/src/common/error.ts

@@ -0,0 +1,163 @@
+import { OWNER_AFFILIATIONS } from './constants.js';
+
+/**
+ * @file One error type for everything a card render can fail on.
+ *
+ * A failure carries a `code` a host can branch on, the two lines the error card
+ * draws, and — through the code — whether repeating the request could help.
+ * The fetchers throw this rather than a bare `Error`, so a host is told what failed.
+ * Anything else that escapes is wrapped as `upstream` by `from`, which is retryable —
+ * so a permanent failure has to throw a `CardError` to be reported as one.
+ */
+
+/** A general message to ask user to try again later. */
+const TRY_AGAIN_LATER = 'Please try again later';
+
+/** Why a request failed. */
+type ErrorCode =
+  /** The query is wrong: a param is malformed, unsafe, or not renderable. */
+  | 'invalid_param'
+  /** The query is missing a param the endpoint cannot render without. */
+  | 'missing_param'
+  /** The user, repository or gist does not exist. */
+  | 'not_found'
+  /** The deployment has no usable GitHub token. */
+  | 'no_tokens'
+  /** Every token is rate limited. */
+  | 'rate_limited'
+  /** GitHub or WakaTime answered with something unusable. */
+  | 'upstream';
+
+/**
+ * Whether repeating the request could produce a different answer.
+ * A host reads this to decide between caching the failure and retrying it.
+ */
+const RETRYABLE: Record<ErrorCode, boolean> = {
+  invalid_param: false,
+  missing_param: false,
+  not_found: false,
+  no_tokens: false,
+  rate_limited: true,
+  upstream: true,
+};
+
+/** The second line the error card draws, per code. */
+const SECONDARY_ERROR_MESSAGES: Partial<Record<ErrorCode, string>> = {
+  rate_limited: 'You can deploy own instance or wait until public will be no longer limited',
+  no_tokens:
+    'Please add an env variable called PAT_1 with your GitHub API token in your deployment environment',
+  upstream: TRY_AGAIN_LATER,
+};
+
+/** What a failure is, once it reaches the api layer. */
+interface CardErrorInit {
+  /** Why it failed. */
+  code: ErrorCode;
+  /** Second line of the error card; the code's own message when omitted. */
+  secondaryMessage?: string | undefined;
+  /** The first param at fault, when the failure names one. */
+  param?: string | undefined;
+}
+
+/** Everything this package throws. */
+class CardError extends Error {
+  readonly code: ErrorCode;
+  readonly secondaryMessage: string | undefined;
+  readonly param: string | undefined;
+
+  /**
+   * @param message First line of the error card.
+   * @param init Why it failed, and what to draw under the message.
+   */
+  constructor(message: string, init: CardErrorInit) {
+    super(message);
+    this.name = 'CardError';
+    this.code = init.code;
+    this.param = init.param;
+    this.secondaryMessage = init.secondaryMessage ?? SECONDARY_ERROR_MESSAGES[init.code];
+  }
+
+  /** Whether repeating the request could produce a different answer. */
+  get retryable(): boolean {
+    return RETRYABLE[this.code];
+  }
+
+  /**
+   * A param the endpoint cannot render with.
+   *
+   * @param param Name of the param.
+   * @param secondaryMessage What is wrong with it.
+   * @returns The error.
+   */
+  static invalidParam(param: string, secondaryMessage: string): CardError {
+    return new CardError('Something went wrong', {
+      code: 'invalid_param',
+      secondaryMessage,
+      param,
+    });
+  }
+
+  /**
+   * A param the endpoint cannot render without.
+   *
+   * @param params Names of the missing params.
+   *        `param` carries the first; the message names them all.
+   * @param secondaryMessage Where to pass them, when the endpoint can say.
+   * @returns The error.
+   */
+  static missingParam(params: Array<string>, secondaryMessage?: string): CardError {
+    const named = params.map((param) => `"${param}"`).join(', ');
+    return new CardError(`Missing params ${named} make sure you pass the parameters in URL`, {
+      code: 'missing_param',
+      secondaryMessage,
+      param: params[0],
+    });
+  }
+
+  /**
+   * Anything thrown that is not already a `CardError`:
+   * an upstream failure, since the query itself got this far.
+   *
+   * @param err Whatever was thrown.
+   * @returns The error, unchanged when it already was one.
+   */
+  static from(err: unknown): CardError {
+    if (err instanceof CardError) {
+      return err;
+    }
+    if (err instanceof Error) {
+      return new CardError(err.message, { code: 'upstream' });
+    }
+    return new CardError('An unknown error occurred', { code: 'upstream' });
+  }
+}
+
+/** The affiliation values `role` accepts, named in the rejection. */
+const INVALID_AFFILIATION = `Invalid owner affiliations. Valid values are: ${OWNER_AFFILIATIONS.join(
+  ', ',
+)}`;
+
+/** The user exists but has no public WakaTime profile. */
+const WAKATIME_USER_NOT_FOUND = 'Make sure you have a public WakaTime profile';
+
+/** A GitHub username that resolves to nothing, or to an organization. */
+const USER_NOT_FOUND = 'Make sure the provided username is not an organization';
+
+/** A repository the token cannot see, because it is missing or private. */
+const REPO_NOT_FOUND = 'Make sure the provided username and repository are correct';
+
+/** A gist id that resolves to nothing. */
+const GIST_NOT_FOUND = 'Make sure the provided gist ID is correct';
+
+export type { ErrorCode };
+
+export {
+  CardError,
+  GIST_NOT_FOUND,
+  INVALID_AFFILIATION,
+  REPO_NOT_FOUND,
+  SECONDARY_ERROR_MESSAGES,
+  TRY_AGAIN_LATER,
+  USER_NOT_FOUND,
+  WAKATIME_USER_NOT_FOUND,
+};

package/src/common/fmt.ts

@@ -0,0 +1,86 @@
+import { encodeHTML } from './html.js';
+import { splitWrappedText } from './render.js';
+
+/**
+ * Retrieves num with suffix k(thousands) precise to given decimal places.
+ *
+ * @param num The number to format.
+ * @param precision The number of decimal places to include.
+ * @returns The formatted number.
+ */
+const kFormatter = (num: number, precision?: number): string | number => {
+  const abs = Math.abs(num);
+  const sign = Math.sign(num);
+
+  if (typeof precision === 'number' && !isNaN(precision)) {
+    return (sign * (abs / 1000)).toFixed(precision) + 'k';
+  }
+
+  if (abs < 1000) {
+    return sign * abs;
+  }
+
+  return `${sign * parseFloat((abs / 1000).toFixed(1))}k`;
+};
+
+/**
+ * Convert bytes to a human-readable string representation.
+ *
+ * @param bytes The number of bytes to convert.
+ * @returns The human-readable representation of bytes.
+ * @throws {Error} If bytes is negative or too large.
+ */
+const formatBytes = (bytes: number): string => {
+  if (bytes < 0) {
+    throw new Error('Bytes must be a non-negative number');
+  }
+
+  if (bytes === 0) {
+    return '0 B';
+  }
+
+  const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB'];
+  const base = 1024;
+  const i = Math.floor(Math.log(bytes) / Math.log(base));
+
+  const unit = sizes[i];
+  if (unit === undefined) {
+    throw new Error('Bytes is too large to convert to a human-readable string');
+  }
+
+  return `${(bytes / Math.pow(base, i)).toFixed(1)} ${unit}`;
+};
+
+/**
+ * Split text over multiple lines based on the card width.
+ *
+ * @param text Text to split.
+ * @param width Available wrap width in px.
+ * @param fontSize Font size in px.
+ * @param maxLines Maximum number of lines.
+ * @returns Array of lines.
+ */
+const wrapTextMultiline = (
+  text: string,
+  width: number,
+  fontSize: number,
+  maxLines = 3,
+): Array<string> => {
+  const wrapped = splitWrappedText(text, fontSize, width);
+  const lines = wrapped.map((line) => encodeHTML(line.trim())).slice(0, maxLines); // Only consider maxLines lines
+
+  // Add "..." to the last line if the text exceeds maxLines
+  if (wrapped.length > maxLines) {
+    const lastIndex = maxLines - 1;
+    const lastLine = lines[lastIndex];
+    if (lastLine !== undefined) {
+      lines[lastIndex] = `${lastLine}...`;
+    }
+  }
+
+  // Remove empty lines if text fits in less than maxLines lines
+  const multiLineText = lines.filter(Boolean);
+  return multiLineText;
+};
+
+export { kFormatter, formatBytes, wrapTextMultiline };

package/src/common/html.ts

@@ -0,0 +1,17 @@
+/**
+ * Encode string as HTML.
+ *
+ * @see https://stackoverflow.com/a/48073476/10629172
+ */
+const encodeHTML = (str: string): string => {
+  return (
+    str
+      .replace(/[\u00A0-\u9999<>&"'](?!#)/gim, (i: string) => {
+        return `&#${i.charCodeAt(0)};`;
+      })
+      // eslint-disable-next-line no-control-regex
+      .replace(/\u0008/gim, '')
+  );
+};
+
+export { encodeHTML };

package/src/common/http.ts

@@ -0,0 +1,98 @@
+import type { GraphQLDocument } from '../graphql/graphqlDocument.js';
+
+const GITHUB_GRAPHQL_API = 'https://api.github.com/graphql';
+
+/**
+ * The slice of `fetch` this library calls.
+ * A host substitutes it through `CardConfig` to mock, cache or proxy every request core makes.
+ */
+type FetchLike = (input: string, init?: RequestInit) => Promise<Response>;
+
+/**
+ * Resolves the global `fetch` at call time rather than capturing it on import,
+ * so a host that patches the global afterwards is still picked up.
+ */
+const defaultFetch: FetchLike = (input, init) => fetch(input, init);
+
+/**
+ * A response, parsed.
+ * A non-2xx is a value here rather than a throw:
+ * the retryer reads the body of a rejected request to tell a spent token from a rate limit.
+ */
+interface HttpResponse<TData> {
+  status: number;
+  /** Reason phrase, which HTTP/2 omits — only ever used to annotate an error. */
+  statusText: string;
+  data: TData;
+}
+
+/** What the retryer hands a fetcher on each attempt. */
+interface FetcherContext {
+  /** Transport to send the request with. */
+  fetch: FetchLike;
+  /** Attempt index, from 0. Tests read it to fake a rate limit on the first token. */
+  retries: number;
+}
+
+/**
+ * @param fetchImpl Transport to send the request with.
+ * @param url Absolute URL to request.
+ * @param init Request init forwarded to the transport.
+ * @returns The response; a JSON body parsed, anything else left as text.
+ */
+const httpRequest = async <TData>(
+  fetchImpl: FetchLike,
+  url: string,
+  init?: RequestInit,
+): Promise<HttpResponse<TData>> => {
+  const response = await fetchImpl(url, init);
+  const body = await response.text();
+
+  let data: unknown;
+  try {
+    data = JSON.parse(body);
+  } catch {
+    // an empty or non-JSON body reads as text, so callers still get a defined `data`
+    data = body;
+  }
+
+  return {
+    status: response.status,
+    statusText: response.statusText,
+    data: data as TData,
+  };
+};
+
+/** Response of a GraphQL call: the envelope the GitHub API wraps results in. */
+type GraphQLResponse<TResult> = HttpResponse<{
+  data: TResult;
+  errors?: Array<{ type?: string; message?: string }>;
+}>;
+
+/**
+ * @param document Generated query document.
+ * @param scheme `Authorization` scheme for the token.
+ * @returns A fetcher `retryer` can drive.
+ */
+const createGraphQLFetcher = <TResult, TVariables>(
+  document: GraphQLDocument<TResult, TVariables>,
+  scheme: 'bearer' | 'token',
+) => {
+  return (
+    variables: TVariables,
+    token: string,
+    { fetch }: FetcherContext,
+  ): Promise<GraphQLResponse<TResult>> => {
+    return httpRequest(fetch, GITHUB_GRAPHQL_API, {
+      method: 'POST',
+      headers: {
+        Authorization: `${scheme} ${token}`,
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({ query: document.text, variables }),
+    });
+  };
+};
+
+export { createGraphQLFetcher, defaultFetch, httpRequest };
+export type { FetcherContext, FetchLike, GraphQLResponse, HttpResponse };

package/src/common/icons.ts

@@ -0,0 +1,80 @@
+/*
+The icons in this file are based on https://github.com/primer/octicons which is released under the MIT license:
+
+MIT License
+
+Copyright (c) 2026 GitHub Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+*/
+
+const icons = {
+  star: `<path fill-rule="evenodd" d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25zm0 2.445L6.615 5.5a.75.75 0 01-.564.41l-3.097.45 2.24 2.184a.75.75 0 01.216.664l-.528 3.084 2.769-1.456a.75.75 0 01.698 0l2.77 1.456-.53-3.084a.75.75 0 01.216-.664l2.24-2.183-3.096-.45a.75.75 0 01-.564-.41L8 2.694v.001z"/>`,
+  commits: `<path fill-rule="evenodd" d="M1.643 3.143L.427 1.927A.25.25 0 000 2.104V5.75c0 .138.112.25.25.25h3.646a.25.25 0 00.177-.427L2.715 4.215a6.5 6.5 0 11-1.18 4.458.75.75 0 10-1.493.154 8.001 8.001 0 101.6-5.684zM7.75 4a.75.75 0 01.75.75v2.992l2.028.812a.75.75 0 01-.557 1.392l-2.5-1A.75.75 0 017 8.25v-3.5A.75.75 0 017.75 4z"/>`,
+  prs: `<path fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"/>`,
+  prs_merged: `<path fill-rule="evenodd" d="M5.45 5.154A4.25 4.25 0 0 0 9.25 7.5h1.378a2.251 2.251 0 1 1 0 1.5H9.25A5.734 5.734 0 0 1 5 7.123v3.505a2.25 2.25 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.95-.218ZM4.25 13.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm8.5-4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM5 3.25a.75.75 0 1 0 0 .005V3.25Z" />`,
+  prs_merged_percentage: `<path fill-rule="evenodd" d="M13.442 2.558a.625.625 0 0 1 0 .884l-10 10a.625.625 0 1 1-.884-.884l10-10a.625.625 0 0 1 .884 0zM4.5 6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5zm7 6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z" />`,
+  issues: `<path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"/>`,
+  icon: `<path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"/>`,
+  contribs: `<path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"/>`,
+  fork: `<path fill-rule="evenodd" d="M5 3.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm0 2.122a2.25 2.25 0 10-1.5 0v.878A2.25 2.25 0 005.75 8.5h1.5v2.128a2.251 2.251 0 101.5 0V8.5h1.5a2.25 2.25 0 002.25-2.25v-.878a2.25 2.25 0 10-1.5 0v.878a.75.75 0 01-.75.75h-4.5A.75.75 0 015 6.25v-.878zm3.75 7.378a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm3-8.75a.75.75 0 100-1.5.75.75 0 000 1.5z"></path>`,
+  reviews: `<path fill-rule="evenodd" d="M8 2c1.981 0 3.671.992 4.933 2.078 1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14c-1.981 0-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2ZM1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5c1.473 0 2.825-.742 3.955-1.715 1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5c-1.473 0-2.825.742-3.955 1.715-1.124.967-1.954 2.096-2.366 2.717ZM8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10Z"/>`,
+  discussions_started: `<path fill-rule="evenodd" d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z" />`,
+  discussions_answered: `<path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z" />`,
+  comments: `<path d="M1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 13.25 12H9.06l-2.573 2.573A1.458 1.458 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z" />`,
+  contributions: `<path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm7.25-3.25v2.5h2.5a.75.75 0 0 1 0 1.5h-2.5v2.5a.75.75 0 0 1-1.5 0v-2.5h-2.5a.75.75 0 0 1 0-1.5h2.5v-2.5a.75.75 0 0 1 1.5 0Z"/>`,
+  gist: `<path fill-rule="evenodd" d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25Zm7.47 3.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L10.69 8 9.22 6.53a.75.75 0 0 1 0-1.06ZM6.78 6.53 5.31 8l1.47 1.47a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z" />`,
+};
+
+/**
+ * Get rank icon
+ *
+ * @param rankIcon - The rank icon type.
+ * @param rankLevel - The rank level.
+ * @param percentile - The rank percentile.
+ * @returns The SVG code of the rank icon
+ */
+const rankIcon = (rankIcon: string, rankLevel: string, percentile: number): string => {
+  switch (rankIcon) {
+    case 'github':
+      return `
+        <svg x="-38" y="-30" height="66" width="66" aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true" data-testid="github-rank-icon">
+          <path d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"></path>
+        </svg>
+      `;
+    case 'percentile':
+      return `
+        <text x="-5" y="-12" alignment-baseline="central" dominant-baseline="central" text-anchor="middle" data-testid="percentile-top-header" class="rank-percentile-header">
+          Top
+        </text>
+        <text x="-5" y="12" alignment-baseline="central" dominant-baseline="central" text-anchor="middle" data-testid="percentile-rank-value" class="rank-percentile-text">
+          ${percentile.toFixed(1)}%
+        </text>
+      `;
+    case 'default':
+    default:
+      return `
+        <text x="-5" y="3" alignment-baseline="central" dominant-baseline="central" text-anchor="middle" data-testid="level-rank-icon">
+          ${rankLevel}
+        </text>
+      `;
+  }
+};
+
+export { icons, rankIcon };