5 files changed, 55 insertions, 0 deletions

diff --git a/client/src/app/shared/shared-main/feeds/feed.component.html b/client/src/app/shared/shared-main/feeds/feed.component.html
new file mode 100644
index 000000000..ac0b1f454
--- /dev/null
+++ b/client/src/app/shared/shared-main/feeds/feed.component.html
@@ -0,0 +1,15 @@
+<div class="video-feed"
+  [ngbTooltip]="'Feeds available'"
+  placement="right auto"
+  container="body"
+>
+  <my-global-icon
+    *ngIf="syndicationItems.length !== 0" [ngbPopover]="feedsList" [autoClose]="true" placement="bottom"
+    class="icon-syndication" role="button" iconName="syndication"
+  >
+  </my-global-icon>
+
+  <ng-template #feedsList>
+    <a *ngFor="let item of syndicationItems" [href]="item.url" target="_blank" rel="noopener noreferrer">{{ item.label }}</a>
+  </ng-template>
+</div>
diff --git a/client/src/app/shared/shared-main/feeds/feed.component.scss b/client/src/app/shared/shared-main/feeds/feed.component.scss
new file mode 100644
index 000000000..34dd0e937
--- /dev/null
+++ b/client/src/app/shared/shared-main/feeds/feed.component.scss
@@ -0,0 +1,20 @@
+@import '_variables';
+@import '_mixins';
+
+.video-feed {
+  width: min-content;
+
+  a {
+    color: black;
+    display: block;
+  }
+
+  my-global-icon {
+    cursor: pointer;
+    width: 12px;
+    position: relative;
+    top: -2px;
+
+    @include apply-svg-color(pvar(--mainForegroundColor))
+  }
+}
diff --git a/client/src/app/shared/shared-main/feeds/feed.component.ts b/client/src/app/shared/shared-main/feeds/feed.component.ts
new file mode 100644
index 000000000..ee3731c1d
--- /dev/null
+++ b/client/src/app/shared/shared-main/feeds/feed.component.ts
@@ -0,0 +1,11 @@
+import { Component, Input } from '@angular/core'
+import { Syndication } from './syndication.model'
+
+@Component({
+  selector: 'my-feed',
+  styleUrls: [ './feed.component.scss' ],
+  templateUrl: './feed.component.html'
+})
+export class FeedComponent {
+  @Input() syndicationItems: Syndication[]
+}
diff --git a/client/src/app/shared/shared-main/feeds/index.ts b/client/src/app/shared/shared-main/feeds/index.ts
new file mode 100644
index 000000000..6bc396699
--- /dev/null
+++ b/client/src/app/shared/shared-main/feeds/index.ts
@@ -0,0 +1,2 @@
+export * from './feed.component'
+export * from './syndication.model'
diff --git a/client/src/app/shared/shared-main/feeds/syndication.model.ts b/client/src/app/shared/shared-main/feeds/syndication.model.ts
new file mode 100644
index 000000000..2466ae7c6
--- /dev/null
+++ b/client/src/app/shared/shared-main/feeds/syndication.model.ts
@@ -0,0 +1,7 @@
+import { FeedFormat } from '@shared/models'
+
+export interface Syndication {
+  format: FeedFormat,
+  label: string,
+  url: string
+}