/* global React */

const storyChapters = [
  ["00", "Open", "#top"],
  ["01", "Story", "#journey"],
  ["02", "About", "#about"],
  ["03", "Work", "#work"],
  ["04", "Cases", "#cases"],
  ["05", "Tools", "#toolkit"],
  ["06", "Proof", "#credentials"],
  ["07", "Contact", "#contact"],
];

window.StoryRail = function StoryRail() {
  return (
    <aside className="story-rail" aria-label="Portfolio chapters">
      <div className="story-rail__line" aria-hidden="true" />
      {storyChapters.map(([num, label, href]) => (
        <a href={href} key={href}>
          <span>{num}</span>
          <strong>{label}</strong>
        </a>
      ))}
    </aside>
  );
};