sidebarsTheoplayer.ts

import type { SidebarsConfig } from '@docusaurus/plugin-content-docs';
import type {
  SidebarItemBase,
  SidebarItemCategoryConfig,
  SidebarItemConfig,
  SidebarItemHtml,
  SidebarItemLink,
} from '@docusaurus/plugin-content-docs/lib/sidebars/types.d.ts';

const platformNames = ['web', 'android', 'ios', 'react', 'react-native', 'chromecast', 'roku', 'flutter'] as const;
const sidebars: SidebarsConfig = {
  web: [
    'web/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'getting-started/sdks/web/getting-started' },
      items: [
        { type: 'autogenerated', dirName: 'getting-started/01-sdks/01-web' },
        {
          type: 'category',
          label: 'LG webOS',
          customProps: {
            icon: '📺',
          },
          link: { type: 'doc', id: 'getting-started/sdks/webos/getting-started' },
          items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/07-webos' }],
        },
        {
          type: 'category',
          label: 'Samsung Tizen TV',
          customProps: {
            icon: '📺',
          },
          link: { type: 'doc', id: 'getting-started/sdks/tizen/getting-started' },
          items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/08-tizen' }],
        },
        { type: 'autogenerated', dirName: 'getting-started/02-frameworks' },
      ],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
        {
          type: 'autogenerated',
          dirName: 'how-to-guides/web',
        },
      ],
    }),
    examplesCategory({
      link: { type: 'doc', id: 'examples/index' },
      items: [{ type: 'autogenerated', dirName: 'examples' }],
    }),
    connectorsCategory({
      link: { type: 'doc', id: 'connectors/web/index' },
      items: webConnectorItems(),
    }),
    'changelog',
    apiReferencesLink({
      href: 'pathname:///theoplayer/v8/api-reference/web/',
    }),
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  android: [
    'android/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'getting-started/sdks/android/getting-started' },
      items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/02-android' }],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
        {
          type: 'autogenerated',
          dirName: 'how-to-guides/android',
        },
      ],
    }),
    connectorsCategory({
      link: { type: 'doc', id: 'connectors/android/index' },
      items: androidConnectorItems(),
    }),
    'changelog',
    apiReferencesLink({
      href: 'pathname:///theoplayer/v8/api-reference/android/',
    }),
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  ios: [
    'ios/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'getting-started/sdks/ios/getting-started' },
      items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/03-ios' }],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
        {
          type: 'autogenerated',
          dirName: 'how-to-guides/ios',
        },
      ],
    }),
    connectorsCategory({
      link: { type: 'doc', id: 'connectors/ios/index' },
      items: iosConnectorItems(),
    }),
    'changelog',
    apiReferencesLink({
      href: 'pathname:///theoplayer/v8/api-reference/ios/',
    }),
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  'react-native': [
    'react-native/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'external/react-native-theoplayer/doc/getting-started' },
      items: [{ type: 'autogenerated', dirName: 'external/react-native-theoplayer/doc' }],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
      ],
    }),
    'external/react-native-theoplayer/CHANGELOG',
    apiReferencesLink({
      href: 'https://theoplayer.github.io/react-native-theoplayer/api/',
    }),
    githubLink({
      href: 'https://github.com/THEOplayer/react-native-theoplayer',
    }),
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  flutter: [
    'flutter/index',
    'external/flutter-theoplayer-sdk/flutter_theoplayer_sdk/flutter_theoplayer_sdk/README',
    howToGuidesCategory({
      items: [{ type: 'autogenerated', dirName: 'external/flutter-theoplayer-sdk/doc' }],
    }),
    'external/flutter-theoplayer-sdk/flutter_theoplayer_sdk/flutter_theoplayer_sdk/CHANGELOG',
    githubLink({
      href: 'https://github.com/THEOplayer/flutter-theoplayer-sdk',
    }),
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  chromecast: [
    'chromecast/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'getting-started/sdks/chromecast/getting-started' },
      items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/06-chromecast' }],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
      ],
    }),
    'changelog',
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  roku: [
    'roku/index',
    gettingStartedCategory({
      link: { type: 'doc', id: 'getting-started/sdks/roku/getting-started' },
      items: [{ type: 'autogenerated', dirName: 'getting-started/01-sdks/09-roku' }],
    }),
    howToGuidesCategory({
      link: { type: 'doc', id: 'how-to-guides/index' },
      items: [
        {
          type: 'autogenerated',
          dirName: 'how-to-guides',
          customProps: {
            exclude: platformNames,
          },
        },
      ],
    }),
    connectorsCategory({
      link: { type: 'doc', id: 'connectors/roku/index' },
      items: [
        {
          type: 'category',
          label: 'Conviva',
          description: 'Integrate with Conviva analytics.',
          customProps: {
            icon: 'conviva',
          },
          link: {
            type: 'generated-index',
            title: 'Conviva Connector for Roku',
            slug: 'connectors/roku/conviva',
          },
          items: [{ type: 'autogenerated', dirName: 'connectors/roku/conviva' }],
        },
        {
          type: 'category',
          label: 'Comscore',
          description: 'Integrate with Comscore analytics.',
          customProps: {
            icon: 'comscore',
          },
          link: {
            type: 'generated-index',
            title: 'Comscore Connector for Roku',
            slug: 'connectors/roku/comscore',
          },
          items: [{ type: 'autogenerated', dirName: 'connectors/roku/comscore' }],
        },
      ],
    }),
    'api-reference/roku',
    separator(),
    knowledgeBaseCategory(),
    faqLink(),
  ],
  faq: [
    backLink(),
    {
      type: 'category',
      label: 'FAQ',
      collapsible: false,
      link: { type: 'doc', id: 'faq/index' },
      items: [{ type: 'autogenerated', dirName: 'faq' }],
    },
  ],
};

type MakeOptional<T, OptionalKeys extends keyof T> = Pick<T, Exclude<keyof T, OptionalKeys>> & Partial<Pick<T, OptionalKeys>>;
type PredefinedSidebarItemKeys = 'type' | 'label' | 'description' | 'customProps';
type PartialSidebarItemCategoryConfig = MakeOptional<SidebarItemCategoryConfig, PredefinedSidebarItemKeys>;
type PartialSidebarItemLink = MakeOptional<SidebarItemLink, PredefinedSidebarItemKeys>;

function mergeSidebarItems<T extends Partial<SidebarItemBase>, U extends Partial<SidebarItemBase>>(base: T, config: U): T & U {
  return {
    ...base,
    ...config,
    customProps: {
      ...(base.customProps ?? {}),
      ...(config.customProps ?? {}),
    },
  };
}

function gettingStartedCategory(config: PartialSidebarItemCategoryConfig): SidebarItemCategoryConfig {
  return mergeSidebarItems(
    {
      type: 'category' as const,
      label: 'Getting started',
      description: 'Set up your first THEOplayer in just a few minutes!',
      customProps: {
        icon: '🚀',
      },
    },
    config
  );
}

function examplesCategory(config: PartialSidebarItemCategoryConfig): SidebarItemCategoryConfig {
  return mergeSidebarItems(
    {
      type: 'category' as const,
      label: 'Examples',
      description: 'See the player in action!',
      customProps: {
        icon: '🛝',
      },
    },
    config
  );
}

function connectorsCategory(config: PartialSidebarItemCategoryConfig): SidebarItemCategoryConfig {
  return mergeSidebarItems(
    {
      type: 'category' as const,
      label: 'Connectors',
      description: `Integrate third-party solutions with THEOplayer using our pre-built connectors.`,
      customProps: {
        icon: '🔌',
      },
    },
    config
  );
}

function howToGuidesCategory(config: PartialSidebarItemCategoryConfig): SidebarItemCategoryConfig {
  return mergeSidebarItems(
    {
      type: 'category' as const,
      label: 'How-to guides',
      description: 'Learn how to implement our rich set of features and integrations.',
      customProps: {
        icon: '📖',
      },
    },
    config
  );
}

function apiReferencesLink(config: PartialSidebarItemLink): SidebarItemLink {
  return mergeSidebarItems(
    {
      type: 'link' as const,
      label: 'API references',
      description: 'Discover all properties and functions of THEOplayer.',
      customProps: {
        icon: '*️⃣',
      },
    },
    config
  );
}

function githubLink(config: PartialSidebarItemLink): SidebarItemLink {
  return mergeSidebarItems(
    {
      type: 'link' as const,
      label: 'GitHub',
      description: 'Browse the source code or report issues on GitHub.',
      customProps: {
        icon: 'github',
      },
    },
    config
  );
}

function knowledgeBaseCategory(): SidebarItemCategoryConfig {
  return {
    type: 'category',
    label: 'Knowledge base',
    description: 'Learn about topics in the video industry from our experts.',
    customProps: {
      icon: '🧠',
    },
    link: { type: 'doc', id: 'knowledge-base/index' },
    items: [{ type: 'autogenerated', dirName: 'knowledge-base' }],
  };
}

function faqLink(): SidebarItemLink {
  return {
    type: 'link',
    label: 'FAQ',
    description: `Answers to common questions we've received from our customers over the years.`,
    customProps: {
      icon: '❔',
    },
    href: '/theoplayer/faq/',
  };
}

function backLink(): SidebarItemLink {
  return {
    type: 'link',
    label: '« Back',
    href: '/theoplayer/',
    customProps: {
      isBackLink: true,
    },
  };
}

function separator(): SidebarItemHtml {
  return {
    type: 'html',
    value: '<hr>',
  };
}

function webConnectorItems(): SidebarItemConfig[] {
  return [
    {
      type: 'category',
      label: 'CMCD',
      description: 'Integrate with Common Media Client Data (CMCD) for server-side analytics.',
      customProps: {
        icon: '☁️',
      },
      link: {
        type: 'generated-index',
        title: 'CMCD Connector for Web',
        slug: 'connectors/web/cmcd',
      },
      items: [
        'external/web-connectors/cmcd/README',
        'external/web-connectors/cmcd/CHANGELOG',
        apiReferencesLink({
          description: 'Discover all functions provided by the CMCD connector for Web.',
          href: 'https://theoplayer.github.io/web-connectors/api/modules/CMCD_Connector.html',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/web-connectors/tree/main/cmcd',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Comscore',
      description: 'Integrate with Comscore for player analytics.',
      customProps: {
        icon: 'comscore',
      },
      link: {
        type: 'generated-index',
        title: 'Comscore Connector for Web',
        slug: 'connectors/web/comscore',
      },
      items: [
        'external/web-connectors/comscore/README',
        'external/web-connectors/comscore/CHANGELOG',
        apiReferencesLink({
          description: 'Discover all functions provided by the Comscore connector for Web.',
          href: 'https://theoplayer.github.io/web-connectors/api/modules/Comscore_Connector.html',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/web-connectors/tree/main/comscore',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Conviva',
      description: 'Integrate with Conviva for player analytics.',
      customProps: {
        icon: 'conviva',
      },
      link: {
        type: 'generated-index',
        title: 'Conviva Connector for Web',
        slug: 'connectors/web/conviva',
      },
      items: [
        'external/web-connectors/conviva/README',
        'external/web-connectors/conviva/CHANGELOG',
        apiReferencesLink({
          description: 'Discover all functions provided by the Conviva connector for Web.',
          href: 'https://theoplayer.github.io/web-connectors/api/modules/Conviva_Connector.html',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/web-connectors/tree/main/conviva',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Nielsen',
      description: 'Integrate with Nielsen for player analytics.',
      customProps: {
        icon: 'nielsen',
      },
      link: {
        type: 'generated-index',
        title: 'Nielsen Connector for Web',
        slug: 'connectors/web/nielsen',
      },
      items: [
        'external/web-connectors/nielsen/README',
        'external/web-connectors/nielsen/CHANGELOG',
        apiReferencesLink({
          description: 'Discover all functions provided by the Nielsen connector for Web.',
          href: 'https://theoplayer.github.io/web-connectors/api/modules/Nielsen_Connector.html',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/web-connectors/tree/main/nielsen',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Yospace',
      description: 'Integrate with Yospace for server-side ad insertion (SSAI).',
      customProps: {
        icon: 'yospace',
      },
      link: {
        type: 'generated-index',
        title: 'Yospace Connector for Web',
        slug: 'connectors/web/yospace',
      },
      items: [
        'external/web-connectors/yospace/README',
        'external/web-connectors/yospace/CHANGELOG',
        apiReferencesLink({
          description: 'Discover all functions provided by the Yospace connector for Web.',
          href: 'https://theoplayer.github.io/web-connectors/api/modules/Yospace_Connector.html',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/web-connectors/tree/main/yospace',
        }),
      ],
    },
  ];
}

function androidConnectorItems(): SidebarItemConfig[] {
  return [
    {
      type: 'category',
      label: 'Comscore',
      description: 'Integrate with Comscore for player analytics.',
      customProps: {
        icon: 'comscore',
      },
      link: {
        type: 'generated-index',
        title: 'Comscore Connector for Android',
        slug: 'connectors/android/comscore',
      },
      items: [
        'external/android-connector/connectors/analytics/comscore/README',
        apiReferencesLink({
          description: 'Discover all functions provided by the Comscore connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/analytics/comscore/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/analytics/comscore',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Conviva',
      description: 'Integrate with Conviva for player analytics.',
      customProps: {
        icon: 'conviva',
      },
      link: {
        type: 'generated-index',
        title: 'Conviva Connector for Android',
        slug: 'connectors/android/conviva',
      },
      items: [
        'external/android-connector/connectors/analytics/conviva/README',
        apiReferencesLink({
          description: 'Discover all functions provided by the Conviva connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/analytics/conviva/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/analytics/conviva',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Nielsen',
      description: 'Integrate with Nielsen for player analytics.',
      customProps: {
        icon: 'nielsen',
      },
      link: {
        type: 'generated-index',
        title: 'Nielsen Connector for Android',
        slug: 'connectors/android/nielsen',
      },
      items: [
        'external/android-connector/connectors/analytics/nielsen/README',
        apiReferencesLink({
          description: 'Discover all functions provided by the Nielsen connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/analytics/nielsen/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/analytics/nielsen',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Media Session',
      description: 'Integrate with Android Media Session to delegate system-level playback controls to your app.',
      customProps: {
        icon: '📱',
      },
      link: {
        type: 'generated-index',
        title: 'Media Session Connector for Android',
        slug: 'connectors/android/mediasession',
      },
      items: [
        'external/android-connector/connectors/mediasession/README',
        apiReferencesLink({
          description: 'Discover all functions provided by the Media Session connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/mediasession/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/mediasession',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Yospace',
      description: 'Integrate with Yospace for server-side ad insertion (SSAI).',
      customProps: {
        icon: 'yospace',
      },
      link: {
        type: 'generated-index',
        title: 'Yospace Connector for Android',
        slug: 'connectors/android/yospace',
      },
      items: [
        'external/android-connector/connectors/yospace/README',
        apiReferencesLink({
          description: 'Discover all functions provided by the Yospace connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/yospace/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/yospace',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Uplynk',
      description: 'Add support for Uplynk CMS to your player.',
      customProps: {
        icon: 'uplynk',
      },
      link: {
        type: 'generated-index',
        title: 'Uplynk Connector for Android',
        slug: 'connectors/android/uplynk',
      },
      items: [
        'external/android-connector/connectors/uplynk/README',
        howToGuidesCategory({
          description: 'Learn how to use the various features of the Uplynk Connector.',
          link: {
            type: 'generated-index',
            title: 'Guides for the Uplynk Connector for Android',
            slug: 'connectors/android/uplynk/guides',
          },
          items: [{ type: 'autogenerated', dirName: 'external/android-connector/connectors/uplynk/docs' }],
        }),
        apiReferencesLink({
          description: 'Discover all functions provided by the Uplynk connector for Android.',
          href: 'https://theoplayer.github.io/android-connector/api/connectors/uplynk/',
        }),
        githubLink({
          href: 'https://github.com/THEOplayer/android-connector/tree/master/connectors/uplynk',
        }),
      ],
    },
  ];
}

function iosConnectorItems(): SidebarItemConfig[] {
  return [
    {
      type: 'category',
      label: 'Comscore',
      description: 'Integrate with Comscore for player analytics.',
      customProps: {
        icon: 'comscore',
      },
      link: {
        type: 'generated-index',
        title: 'Comscore Connector for iOS & tvOS',
        slug: 'connectors/ios/comscore',
      },
      items: [
        'external/iOS-Connector/Code/Comscore/README',
        'external/iOS-Connector/Code/Comscore-Examples/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Comscore',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Conviva',
      description: 'Integrate with Conviva for player analytics.',
      customProps: {
        icon: 'conviva',
      },
      link: {
        type: 'generated-index',
        title: 'Conviva Connector for iOS & tvOS',
        slug: 'connectors/ios/conviva',
      },
      items: [
        'external/iOS-Connector/Code/Conviva/README',
        'external/iOS-Connector/Code/Conviva-Examples/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Conviva',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Conviva with Verizon Media',
      description: 'Integrate with Conviva and Verizon Media for player analytics.',
      customProps: {
        icon: 'conviva',
      },
      link: {
        type: 'generated-index',
        title: 'Conviva & Verizon Media Connector for iOS & tvOS',
        slug: 'connectors/ios/conviva-verizonmedia',
      },
      items: [
        'external/iOS-Connector/Code/Conviva-VerizonMedia/README',
        'external/iOS-Connector/Code/Conviva-VerizonMedia-Examples/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Conviva-VerizonMedia',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Nielsen',
      description: 'Integrate with Nielsen for player analytics.',
      customProps: {
        icon: 'nielsen',
      },
      link: {
        type: 'generated-index',
        title: 'Nielsen Connector for iOS & tvOS',
        slug: 'connectors/ios/nielsen',
      },
      items: [
        'external/iOS-Connector/Code/Nielsen/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Nielsen',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Yospace',
      description: 'Integrate with Yospace for server-side ad insertion (SSAI).',
      customProps: {
        icon: '💬',
      },
      link: {
        type: 'generated-index',
        title: 'Yospace Connector for iOS & tvOS',
        slug: 'connectors/ios/yospace',
      },
      items: [
        'external/iOS-Connector/Code/Yospace/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Yospace',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Sideloaded Subtitles',
      description: 'Add support for sideloaded subtitles to your player.',
      customProps: {
        icon: '💬',
      },
      link: {
        type: 'generated-index',
        title: 'Sideloaded Subtitles for iOS & tvOS',
        slug: 'connectors/ios/sideloaded-texttracks',
      },
      items: [
        'external/iOS-Connector/Code/Sideloaded-TextTracks/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Sideloaded-TextTracks',
        }),
      ],
    },
    {
      type: 'category',
      label: 'Uplynk',
      description: 'Add support for Uplynk CMS to your player.',
      customProps: {
        icon: 'uplynk',
      },
      link: {
        type: 'generated-index',
        title: 'Uplynk Connector for iOS & tvOS',
        slug: 'connectors/ios/uplynk',
      },
      items: [
        'external/iOS-Connector/Code/Uplynk/README',
        howToGuidesCategory({
          description: 'Learn how to use the various features of the Uplynk Connector.',
          link: {
            type: 'generated-index',
            title: 'Guides for the Uplynk Connector for iOS',
            slug: 'connectors/ios/uplynk/guides',
          },
          items: [{ type: 'autogenerated', dirName: 'external/iOS-Connector/Code/Uplynk/docs' }],
        }),
        'external/iOS-Connector/Code/Uplynk-Examples/README',
        githubLink({
          href: 'https://github.com/THEOplayer/iOS-Connector/tree/main/Code/Uplynk',
        }),
      ],
    },
    'external/iOS-Connector/CHANGELOG',
  ];
}

export default sidebars;