@streamlayer/react-ui 0.52.2 → 0.54.0

package/lib/ui/app/masters.js

@@ -17,13 +17,19 @@ import "@nanostores/react";
 import "@streamlayer/sdk-web-interfaces";
 import "./Features/Gamification/index.js";
 import "@linaria/react";
-import "../show-in/index.js";
-import "./Features/Gamification/Question.js";
 import "../gamification/detail/header/index.js";
 import "../gamification/constants.js";
 import "../gamification/detail/header/styles.js";
 import "../icons/index.js";
-import "../gamification/detail/sponsor/index.js";
+import "../gamification/user-statistics/index.js";
+import "../../utils/common.js";
+import "../gamification/user-statistics/components/rank/index.js";
+import "../gamification/user-statistics/components/rank/styles.js";
+import "../gamification/user-statistics/components/statistic/index.js";
+import "../gamification/user-statistics/components/statistic/styles.js";
+import "../gamification/user-statistics/styles.js";
+import "../show-in/index.js";
+import "./Features/Gamification/Question.js";
 import "../gamification/vote/index.js";
 import "../gamification/vote/feedback/index.js";
 import "../gamification/vote/feedback/styles.js";
@@ -34,45 +40,30 @@ import "../gamification/vote/win-bar/index.js";
 import "../timer/index.js";
 import "react-countdown-circle-timer";
 import "../gamification/vote/win-bar/styles.js";
+import "../gamification/vote/insight-details/index.js";
+import "../video-player/index.js";
+import "../video-player/styles.js";
+import "../gamification/vote/insight-details/styles.js";
 import "./Features/Gamification/Tabs.js";
 import "../gamification/tabs/index.js";
 import "../gamification/tabs/styles.js";
 import "./Features/Gamification/Leaderboard.js";
-import "../gamification/leaderboard-item-detail/index.js";
-import "../gamification/common-header/index.js";
-import "../../icon-exit-d3f9fc80.js";
-import "../gamification/common-header/styles.js";
-import "../gamification/leaderboard-item-detail/styles.js";
-import "../gamification/leaderboard-list/index.js";
+import "../gamification/leaderboard/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../gamification/leaderboard-item/index.js";
-import "../../utils/common.js";
-import "../gamification/leaderboard-item/styles.js";
+import "../gamification/leaderboard/list-item/index.js";
+import "../gamification/leaderboard/list-item/styles.js";
 import "./Features/Gamification/QuestionsList.js";
 import "../gamification/question/list/index.js";
+import "../gamification/insight/index.js";
+import "../gamification/insight/styles.js";
 import "../gamification/question/index.js";
 import "../button/index.js";
 import "../button/styles.js";
 import "../gamification/question/styles.js";
 import "../gamification/question/list/styles.js";
 import "./Features/Gamification/UserSummary.js";
-import "../gamification/user-statistics/index.js";
-import "../gamification/user-statistics/components/rank/index.js";
-import "../gamification/user-statistics/components/rank/styles.js";
-import "../gamification/user-statistics/components/statistic/index.js";
-import "../gamification/user-statistics/components/statistic/styles.js";
-import "../gamification/user-statistics/styles.js";
-import "./Features/Highlights/index.js";
-import "../demo/components/Insight.js";
-import "../gamification/detailed-insight/index.js";
-import "../gamification/detailed-insight/styles.js";
-import "../demo/components/Insights.js";
-import "../gamification/insight-list/index.js";
-import "../gamification/insight/index.js";
-import "../gamification/insight/styles.js";
-import "../gamification/insight-list/styles.js";
 import "../navigation/masters.js";
 import "../navigation/index.js";
 import "../navigation/button/index.js";
@@ -80,7 +71,7 @@ import "../navigation/button/styles.js";
 const C = ({ sdk: r, className: m }) => {
   const [, p] = b(r);
   return /* @__PURE__ */ i(v, { className: m, feature: p, sdk: r });
-}, Wt = ({ sdk: r, overlays: m, children: p }) => {
+}, wt = ({ sdk: r, overlays: m, children: p }) => {
   const { sdkEnabled: o, sdkReady: s, activeOverlay: t, activateAndLoadOverlay: d, enableSdk: l, disableSdk: c } = k(r);
   return /* @__PURE__ */ f(y, { children: [
     o && /* @__PURE__ */ i(
@@ -112,5 +103,5 @@ const C = ({ sdk: r, className: m }) => {
   ] });
 };
 export {
-  Wt as MastersApp
+  wt as MastersApp
 };

package/lib/ui/demo/Gamification.js

@@ -24,6 +24,7 @@ import "../gamification/user-statistics/components/statistic/index.js";
 import "../gamification/user-statistics/components/statistic/styles.js";
 import "../gamification/user-statistics/styles.js";
 import "../gamification/question/list/index.js";
+import "../gamification/insight/index.js";
 import "../gamification/question/index.js";
 import "../button/index.js";
 import "../button/styles.js";
@@ -51,26 +52,23 @@ import "../gamification/onboarding/components/onboarding-slides/onboarding-invit
 import "../gamification/onboarding/components/onboarding-slides/onboarding-rules/index.js";
 import "../gamification/onboarding/components/onboarding-slides/onboarding-rules/styles.js";
 import "../gamification/onboarding/styles.js";
-import "../gamification/leaderboard-item-detail/index.js";
-import "../gamification/common-header/index.js";
-import "../gamification/leaderboard-item-detail/styles.js";
-import "../gamification/leaderboard-list/index.js";
+import "../gamification/leaderboard/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../gamification/leaderboard-item/index.js";
-import "../gamification/leaderboard-item/styles.js";
-const st = ({
+import "../gamification/leaderboard/list-item/index.js";
+import "../gamification/leaderboard/list-item/styles.js";
+const mt = ({
   gamification: r,
   sdk: u
 }) => {
   var d, v, c, b, y, g, S, h, C, G, L, Q, A, E, f, w, x, P, F, O, B, D, R;
-  const T = p(r.status), j = p(r.onboardingStatus), l = p(r.openedQuestion), { slStreamId: e } = p(u.sdkStore), o = p(r.featureSettings), [n, q] = K(a.HOME);
+  const T = p(r.status), j = p(r.onboardingStatus), l = p(r.openedQuestion), { slStreamId: o } = p(u.sdkStore), e = p(r.featureSettings), [n, q] = K(a.HOME);
   if (T !== J.Ready)
     return /* @__PURE__ */ t("div", { children: "wait..." });
-  if (e != null && e.loading)
+  if (o != null && o.loading)
     return /* @__PURE__ */ t(m, { children: /* @__PURE__ */ t("div", { children: "Event is loading" }) });
-  if (!(e != null && e.data))
+  if (!(o != null && o.data))
     return /* @__PURE__ */ t(m, { children: /* @__PURE__ */ t("div", { children: "Event is forbidden" }) });
   if (!j)
     return /* @__PURE__ */ t(m, { children: /* @__PURE__ */ t(
@@ -78,16 +76,16 @@ const st = ({
       {
         closeFeature: u.closeFeature,
         gamification: r,
-        steps: (v = (d = o.inplayGame) == null ? void 0 : d.onboarding) == null ? void 0 : v.steps,
-        gameIcon: (y = (b = (c = o.inplayGame) == null ? void 0 : c.overview) == null ? void 0 : b.media) == null ? void 0 : y.gameIcon,
-        sponsorLogo: (h = (S = (g = o.inplayGame) == null ? void 0 : g.overview) == null ? void 0 : S.media) == null ? void 0 : h.sponsorLogo,
-        rules: (G = (C = o.inplayGame) == null ? void 0 : C.rules) == null ? void 0 : G.rules,
-        rulesBtnLabel: (Q = (L = o.inplayGame) == null ? void 0 : L.rules) == null ? void 0 : Q.buttonLabel,
-        rulesTitle: (E = (A = o.inplayGame) == null ? void 0 : A.rules) == null ? void 0 : E.heading,
-        primaryColor: (x = (w = (f = o.inplayGame) == null ? void 0 : f.overview) == null ? void 0 : w.appearance) == null ? void 0 : x.primaryColor,
-        inviteCardTitle: (F = (P = o.inplayGame) == null ? void 0 : P.inviteCard) == null ? void 0 : F.heading,
-        inviteCardSubtext: (B = (O = o.inplayGame) == null ? void 0 : O.inviteCard) == null ? void 0 : B.subtext,
-        inviteCardBtnLabel: (R = (D = o.inplayGame) == null ? void 0 : D.inviteCard) == null ? void 0 : R.buttonLabel
+        steps: (v = (d = e.inplayGame) == null ? void 0 : d.onboarding) == null ? void 0 : v.steps,
+        gameIcon: (y = (b = (c = e.inplayGame) == null ? void 0 : c.overview) == null ? void 0 : b.media) == null ? void 0 : y.gameIcon,
+        sponsorLogo: (h = (S = (g = e.inplayGame) == null ? void 0 : g.overview) == null ? void 0 : S.media) == null ? void 0 : h.sponsorLogo,
+        rules: (G = (C = e.inplayGame) == null ? void 0 : C.rules) == null ? void 0 : G.rules,
+        rulesBtnLabel: (Q = (L = e.inplayGame) == null ? void 0 : L.rules) == null ? void 0 : Q.buttonLabel,
+        rulesTitle: (E = (A = e.inplayGame) == null ? void 0 : A.rules) == null ? void 0 : E.heading,
+        primaryColor: (x = (w = (f = e.inplayGame) == null ? void 0 : f.overview) == null ? void 0 : w.appearance) == null ? void 0 : x.primaryColor,
+        inviteCardTitle: (F = (P = e.inplayGame) == null ? void 0 : P.inviteCard) == null ? void 0 : F.heading,
+        inviteCardSubtext: (B = (O = e.inplayGame) == null ? void 0 : O.inviteCard) == null ? void 0 : B.subtext,
+        inviteCardBtnLabel: (R = (D = e.inplayGame) == null ? void 0 : D.inviteCard) == null ? void 0 : R.buttonLabel
       }
     ) });
   const H = (i) => {
@@ -112,5 +110,5 @@ const st = ({
   ] });
 };
 export {
-  st as GamificationComponent
+  mt as GamificationComponent
 };

package/lib/ui/demo/Highlights.js

@@ -5,6 +5,8 @@ import { DemoContainer as p } from "./styles.js";
 import "../gamification/user-statistics/components/rank/styles.js";
 import "../gamification/user-statistics/components/statistic/styles.js";
 import "../gamification/user-statistics/styles.js";
+import "@streamlayer/sdk-web-types";
+import "../gamification/insight/styles.js";
 import "../gamification/question/index.js";
 import "../gamification/question/list/styles.js";
 import "./components/Question.js";
@@ -15,14 +17,11 @@ import "../gamification/onboarding/components/onboarding-slides/onboarding-rules
 import "../gamification/onboarding/styles.js";
 import { Insights as c } from "./components/Insights.js";
 import { Insight as f } from "./components/Insight.js";
-import "../gamification/common-header/styles.js";
-import "../gamification/leaderboard-item-detail/styles.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../gamification/leaderboard-item/styles.js";
+import "../gamification/leaderboard/list-item/styles.js";
 import "@linaria/react";
-import "@streamlayer/sdk-web-types";
 import "../button/index.js";
 import "../button/styles.js";
 import "../gamification/constants.js";
@@ -42,13 +41,13 @@ import "../theme/constants.js";
 import "../gamification/vote/win-bar/styles.js";
 import "../gamification/insight-list/index.js";
 import "../gamification/insight/index.js";
-import "../gamification/insight/styles.js";
 import "../gamification/insight-list/styles.js";
 import "../gamification/detailed-insight/index.js";
 import "../gamification/common-header/index.js";
 import "../../icon-exit-d3f9fc80.js";
+import "../gamification/common-header/styles.js";
 import "../gamification/detailed-insight/styles.js";
-const st = ({ highlights: i, sdk: e }) => {
+const nt = ({ highlights: i, sdk: e }) => {
   const n = m(i.status), r = m(i.openedInsight), { slStreamId: o } = m(e.sdkStore);
   return n !== d.Ready ? /* @__PURE__ */ t("div", { children: "wait..." }) : o != null && o.loading ? /* @__PURE__ */ t(p, { children: /* @__PURE__ */ t("div", { children: "Event is loading" }) }) : o != null && o.data ? i.insights === void 0 ? /* @__PURE__ */ t("div", { children: "wait insights..." }) : /* @__PURE__ */ s(p, { children: [
     !r && /* @__PURE__ */ t(c, { highlights: i, store: i.insights.getStore() }),
@@ -63,5 +62,5 @@ const st = ({ highlights: i, sdk: e }) => {
   ] }) : /* @__PURE__ */ t(p, { children: /* @__PURE__ */ t("div", { children: "Event is forbidden" }) });
 };
 export {
-  st as HighlightsComponent
+  nt as HighlightsComponent
 };

package/lib/ui/demo/components/Leaderboard.js

@@ -1,43 +1,35 @@
-import { jsx as i, jsxs as c, Fragment as l } from "react/jsx-runtime";
+import { jsx as e, Fragment as c } from "react/jsx-runtime";
 import { useStore as u } from "@nanostores/react";
 import { useState as b } from "react";
-import { LeaderboardItemDetail as f } from "../../gamification/leaderboard-item-detail/index.js";
-import { LeaderboardList as I } from "../../gamification/leaderboard-list/index.js";
-import "../../gamification/common-header/index.js";
-import "../../../icon-exit-d3f9fc80.js";
-import "../../gamification/common-header/styles.js";
-import "@linaria/react";
-import "../../gamification/leaderboard-item-detail/styles.js";
+import { LeaderboardList as l } from "../../gamification/leaderboard/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../../gamification/leaderboard-item/index.js";
+import "../../gamification/leaderboard/list-item/index.js";
 import "../../../utils/common.js";
-import "../../gamification/leaderboard-item/styles.js";
+import "../../gamification/leaderboard/list-item/styles.js";
+import "@linaria/react";
 import "../../icons/index.js";
-const E = ({ store: p }) => {
-  const { data: r } = u(p), [e, s] = b(void 0);
+const F = ({ store: a }) => {
+  const { data: r } = u(a), [m, s] = b(void 0);
   if (!r)
-    return /* @__PURE__ */ i("div", { children: "wait leader board..." });
-  const o = (t) => {
-    var m;
-    const d = (m = r.find((n) => {
-      var a;
-      return ((a = n.attributes) == null ? void 0 : a.userId) === t;
-    })) == null ? void 0 : m.attributes;
-    s(d);
+    return /* @__PURE__ */ e("div", { children: "wait leader board..." });
+  const d = (t) => {
+    var i;
+    const p = (i = r.find((n) => {
+      var o;
+      return ((o = n.attributes) == null ? void 0 : o.userId) === t;
+    })) == null ? void 0 : i.attributes;
+    s(p);
   };
-  return /* @__PURE__ */ c(l, { children: [
-    e && /* @__PURE__ */ i(f, { comeBack: () => o(null), ...e }),
-    !e && /* @__PURE__ */ i(
-      I,
-      {
-        items: r.filter((t) => t.attributes).map((t) => t.attributes),
-        openItemDetail: o
-      }
-    )
-  ] });
+  return /* @__PURE__ */ e(c, { children: !m && /* @__PURE__ */ e(
+    l,
+    {
+      items: r.filter((t) => t.attributes).map((t) => t.attributes),
+      openItemDetail: d
+    }
+  ) });
 };
 export {
-  E as Leaderboard
+  F as Leaderboard
 };

package/lib/ui/demo/components/QuestionsList.js

@@ -1,20 +1,22 @@
 import { jsx as o } from "react/jsx-runtime";
 import { useStore as m } from "@nanostores/react";
 import { QuestionList as p } from "../../gamification/question/list/index.js";
-import "../../gamification/question/index.js";
+import "../../gamification/insight/index.js";
 import "@streamlayer/sdk-web-types";
+import "../../gamification/insight/styles.js";
+import "@linaria/react";
+import "../../gamification/question/index.js";
 import "../../button/index.js";
 import "../../button/styles.js";
-import "@linaria/react";
 import "../../gamification/constants.js";
 import "../../gamification/question/styles.js";
 import "../../icons/index.js";
 import "react";
 import "../../gamification/question/list/styles.js";
-const l = ({ store: r, openQuestion: i }) => {
+const v = ({ store: r, openQuestion: i }) => {
   const t = m(r);
   return t != null && t.data ? /* @__PURE__ */ o(p, { openQuestion: i, questions: t.data }) : /* @__PURE__ */ o("div", { children: "wait questions..." });
 };
 export {
-  l as QuestionsList
+  v as QuestionsList
 };

package/lib/ui/demo/components/index.js

@@ -1,10 +1,10 @@
-import { UserSummary as pr } from "./UserSummary.js";
-import { QuestionsList as er } from "./QuestionsList.js";
-import { Question as fr } from "./Question.js";
-import { Onboarding as nr } from "../../gamification/onboarding/index.js";
-import { Insights as dr } from "./Insights.js";
-import { Insight as ur } from "./Insight.js";
-import { Leaderboard as hr } from "./Leaderboard.js";
+import { UserSummary as tr } from "./UserSummary.js";
+import { QuestionsList as pr } from "./QuestionsList.js";
+import { Question as er } from "./Question.js";
+import { Onboarding as fr } from "../../gamification/onboarding/index.js";
+import { Insights as nr } from "./Insights.js";
+import { Insight as dr } from "./Insight.js";
+import { Leaderboard as ur } from "./Leaderboard.js";
 import "react/jsx-runtime";
 import "@nanostores/react";
 import "../../gamification/user-statistics/index.js";
@@ -16,8 +16,10 @@ import "../../gamification/user-statistics/components/statistic/index.js";
 import "../../gamification/user-statistics/components/statistic/styles.js";
 import "../../gamification/user-statistics/styles.js";
 import "../../gamification/question/list/index.js";
-import "../../gamification/question/index.js";
+import "../../gamification/insight/index.js";
 import "@streamlayer/sdk-web-types";
+import "../../gamification/insight/styles.js";
+import "../../gamification/question/index.js";
 import "../../button/index.js";
 import "../../button/styles.js";
 import "../../gamification/constants.js";
@@ -46,27 +48,23 @@ import "../../gamification/onboarding/components/onboarding-slides/onboarding-ru
 import "../../gamification/onboarding/components/onboarding-slides/onboarding-rules/styles.js";
 import "../../gamification/onboarding/styles.js";
 import "../../gamification/insight-list/index.js";
-import "../../gamification/insight/index.js";
-import "../../gamification/insight/styles.js";
 import "../../gamification/insight-list/styles.js";
 import "../../gamification/detailed-insight/index.js";
 import "../../gamification/common-header/index.js";
 import "../../gamification/common-header/styles.js";
 import "../../gamification/detailed-insight/styles.js";
-import "../../gamification/leaderboard-item-detail/index.js";
-import "../../gamification/leaderboard-item-detail/styles.js";
-import "../../gamification/leaderboard-list/index.js";
+import "../../gamification/leaderboard/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../../gamification/leaderboard-item/index.js";
-import "../../gamification/leaderboard-item/styles.js";
+import "../../gamification/leaderboard/list-item/index.js";
+import "../../gamification/leaderboard/list-item/styles.js";
 export {
-  ur as Insight,
-  dr as Insights,
-  hr as Leaderboard,
-  nr as Onboarding,
-  fr as Question,
-  er as QuestionsList,
-  pr as UserSummary
+  dr as Insight,
+  nr as Insights,
+  ur as Leaderboard,
+  fr as Onboarding,
+  er as Question,
+  pr as QuestionsList,
+  tr as UserSummary
 };

package/lib/ui/demo/index.js

@@ -36,6 +36,8 @@ import "../gamification/user-statistics/components/statistic/styles.js";
 import "../gamification/user-statistics/styles.js";
 import "./components/QuestionsList.js";
 import "../gamification/question/list/index.js";
+import "../gamification/insight/index.js";
+import "../gamification/insight/styles.js";
 import "../gamification/question/index.js";
 import "../button/index.js";
 import "../button/styles.js";
@@ -64,25 +66,21 @@ import "../gamification/onboarding/components/onboarding-slides/onboarding-invit
 import "../gamification/onboarding/components/onboarding-slides/onboarding-rules/index.js";
 import "../gamification/onboarding/components/onboarding-slides/onboarding-rules/styles.js";
 import "../gamification/onboarding/styles.js";
-import "../gamification/insight/styles.js";
 import "../gamification/insight-list/styles.js";
 import "../gamification/common-header/styles.js";
 import "../gamification/detailed-insight/styles.js";
 import "./components/Leaderboard.js";
-import "../gamification/leaderboard-item-detail/index.js";
-import "../gamification/common-header/index.js";
-import "../gamification/leaderboard-item-detail/styles.js";
-import "../gamification/leaderboard-list/index.js";
+import "../gamification/leaderboard/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
-import "../gamification/leaderboard-item/index.js";
-import "../gamification/leaderboard-item/styles.js";
+import "../gamification/leaderboard/list-item/index.js";
+import "../gamification/leaderboard/list-item/styles.js";
 import "./components/Insights.js";
 import "../gamification/insight-list/index.js";
-import "../gamification/insight/index.js";
 import "./components/Insight.js";
 import "../gamification/detailed-insight/index.js";
+import "../gamification/common-header/index.js";
 import "@streamlayer/sdk-web-anonymous-auth";
 import "../login/index.js";
 import "react-auth-code-input";
@@ -170,7 +168,7 @@ const R = ({ activeFeature: o, sdk: r }) => {
     ] }),
     h
   ] });
-}, Sr = ({ sdk: o }) => {
+}, hr = ({ sdk: o }) => {
   const r = f(o.organizationStore()), t = f(o.getUserStore()), a = f(o.getActiveFeature());
   return r.loading ? /* @__PURE__ */ e("div", { children: "authentication..." }) : r.data ? t.loading ? /* @__PURE__ */ e("div", { children: "authentication..." }) : t.data ? /* @__PURE__ */ l(T, { children: [
     /* @__PURE__ */ e(x, { notificationsStore: o.getNotificationsStore() }),
@@ -178,5 +176,5 @@ const R = ({ activeFeature: o, sdk: r }) => {
   ] }) : /* @__PURE__ */ e(H, { sdk: o }) : /* @__PURE__ */ e("div", { children: "wrong sdk key..." });
 };
 export {
-  Sr as Demo
+  hr as Demo
 };

package/lib/ui/gamification/detail/header/index.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="react" />
 import { QuestionType } from '@streamlayer/sdk-web-types';
 interface VoteHeaderProps {
-    type: QuestionType;
+    type?: QuestionType;
     close: () => void;
+    label?: string;
 }
 export declare const VoteHeader: React.FC<VoteHeaderProps>;
 export {};

package/lib/ui/gamification/detail/header/index.js

@@ -1,18 +1,18 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { QuestionTypeData as t } from "../../constants.js";
-import { Container as m, QuestionTypeWrap as c, QuestionTypeIcon as l, QuestionTypeTitle as p, CloseButton as s, CloseIcon as a } from "./styles.js";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { QuestionTypeData as c } from "../../constants.js";
+import { Container as t, QuestionTypeWrap as l, QuestionTypeIcon as s, QuestionTypeTitle as p, CloseButton as a, CloseIcon as d } from "./styles.js";
 import "@streamlayer/sdk-web-types";
 import "@linaria/react";
 import "../../../icons/index.js";
 import "react";
-const b = ({ type: n, close: i }) => {
-  const o = t[n];
-  return /* @__PURE__ */ r(m, { children: [
-    /* @__PURE__ */ r(c, { children: [
-      (o == null ? void 0 : o.iconName) && /* @__PURE__ */ e(l, { name: o.iconName }),
+const b = ({ type: r, close: n, label: m }) => {
+  const o = r ? c[r] : { label: m, iconName: void 0 };
+  return /* @__PURE__ */ i(t, { children: [
+    /* @__PURE__ */ i(l, { children: [
+      (o == null ? void 0 : o.iconName) && /* @__PURE__ */ e(s, { name: o.iconName }),
       (o == null ? void 0 : o.label) && /* @__PURE__ */ e(p, { children: o.label })
     ] }),
-    /* @__PURE__ */ e(s, { onClick: i, children: /* @__PURE__ */ e(a, { name: "icon-cross" }) })
+    /* @__PURE__ */ e(a, { onClick: n, children: /* @__PURE__ */ e(d, { name: "icon-cross" }) })
   ] });
 };
 export {

package/lib/ui/gamification/{leaderboard-list → leaderboard}/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { LeaderboardItemProps } from '../../gamification/leaderboard-item';
+import { LeaderboardItemProps } from '../../gamification/leaderboard/list-item';
 type LeaderboardListProps = {
     items: Omit<LeaderboardItemProps, 'openItemDetail'>[];
     openItemDetail: (id: string) => void;

package/lib/ui/gamification/{leaderboard-list → leaderboard}/index.js

@@ -2,9 +2,9 @@ import { jsx as t } from "react/jsx-runtime";
 import l from "react-virtualized-auto-sizer";
 import { FixedSizeList as h } from "react-window";
 import u from "react-window-infinite-loader";
-import { LeaderboardItem as I } from "../leaderboard-item/index.js";
+import { LeaderboardItem as I } from "./list-item/index.js";
 import "../../../utils/common.js";
-import "../leaderboard-item/styles.js";
+import "./list-item/styles.js";
 import "@linaria/react";
 import "../../icons/index.js";
 import "react";

package/lib/ui/gamification/{leaderboard-item → leaderboard/list-item}/index.js

@@ -1,8 +1,8 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { abbreviate as c, formatDecimals as l } from "../../../utils/common.js";
+import { abbreviate as c, formatDecimals as l } from "../../../../utils/common.js";
 import { Container as s, Position as h, Content as p, Avatar as C, AvatarPlaceholder as b, NameContainer as f, Name as v, CurrentUserBadge as x } from "./styles.js";
 import "@linaria/react";
-import "../../icons/index.js";
+import "../../../icons/index.js";
 import "react";
 const k = ({
   rank: o,

package/lib/ui/gamification/{leaderboard-item → leaderboard/list-item}/styles.js

@@ -1,5 +1,5 @@
 import { styled as r } from "@linaria/react";
-import { SvgIcon as e } from "../../icons/index.js";
+import { SvgIcon as e } from "../../../icons/index.js";
 import "react/jsx-runtime";
 import "react";
 const a = r.div`

package/lib/ui/gamification/question/list/index.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
-import type { PickHistory } from '@streamlayer/sl-eslib/interactive/feed/interactive.feed_pb';
+import type { Gamification } from '@streamlayer/feature-gamification';
+type FeedItem = Exclude<Awaited<ReturnType<Exclude<Gamification['feedList'], undefined>['getValue']>>, undefined>;
 interface QuestionListProps {
-    questions: PickHistory[];
+    questions: FeedItem;
     openQuestion: (questionId: string) => void;
 }
 export declare const QuestionList: React.FC<QuestionListProps>;

package/lib/ui/gamification/question/list/index.js

@@ -1,15 +1,28 @@
-import { jsx as t } from "react/jsx-runtime";
-import { Question as i } from "../index.js";
-import { QuestionsContainer as p } from "./styles.js";
+import { jsx as e } from "react/jsx-runtime";
+import { Insight as u } from "../../insight/index.js";
+import { Question as s } from "../index.js";
+import { QuestionsContainer as a } from "./styles.js";
 import "@streamlayer/sdk-web-types";
+import "../../insight/styles.js";
+import "@linaria/react";
 import "../../../button/index.js";
 import "../../../button/styles.js";
-import "@linaria/react";
 import "../../constants.js";
 import "../styles.js";
 import "../../../icons/index.js";
 import "react";
-const u = ({ questions: r, openQuestion: m }) => /* @__PURE__ */ t(p, { children: r == null ? void 0 : r.map((o) => /* @__PURE__ */ t(i, { openQuestion: m, ...o }, o.questionId)) });
+const j = ({ questions: r, openQuestion: o }) => /* @__PURE__ */ e(a, { children: r == null ? void 0 : r.map((t) => {
+  var n, m;
+  if (t.type === "question" && ((n = t.attributes) == null ? void 0 : n.attributes.case) === "question") {
+    const i = t.attributes.attributes.value;
+    return /* @__PURE__ */ e(s, { openQuestion: o, ...i }, i.questionId);
+  }
+  if (t.type === "insight" && ((m = t.attributes) == null ? void 0 : m.attributes.case) === "insight") {
+    const i = t.attributes.attributes.value;
+    return /* @__PURE__ */ e(u, { ...i, openInsight: o }, i.questionId);
+  }
+  return null;
+}) });
 export {
-  u as QuestionList
+  j as QuestionList
 };

package/lib/ui/gamification/vote/insight-details/index.d.ts

@@ -1,10 +1,3 @@
 /// <reference types="react" />
-import { VideoPlayerProps } from '../../../video-player';
-export type InsightDetailsProps = {
-    poster?: string;
-    video?: VideoPlayerProps;
-    title: string;
-    description: string;
-    webLink?: string;
-};
-export declare const InsightDetails: React.FC<InsightDetailsProps>;
+import { InsightHistory } from '@streamlayer/sdk-web-types';
+export declare const InsightDetails: React.FC<InsightHistory>;

package/lib/ui/gamification/vote/insight-details/index.js

@@ -1,21 +1,21 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { SvgIcon as m } from "../../../icons/index.js";
-import { VideoPlayer as l } from "../../../video-player/index.js";
-import { Container as p, Content as s, Title as c, Description as a, WebLinkBtn as h } from "./styles.js";
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import { SvgIcon as d } from "../../../icons/index.js";
+import { VideoPlayer as e } from "../../../video-player/index.js";
+import { Container as p, Content as c, Title as h, Description as b, WebLinkBtn as f } from "./styles.js";
 import "@linaria/react";
 import "react";
 import "../../../video-player/styles.js";
-const y = ({ video: t, title: i, description: n, webLink: o }) => /* @__PURE__ */ e(p, { children: [
-  t && /* @__PURE__ */ r(l, { ...t }),
-  /* @__PURE__ */ e(s, { children: [
-    /* @__PURE__ */ r(c, { children: i }),
-    /* @__PURE__ */ r(a, { children: n }),
-    o && /* @__PURE__ */ e(h, { href: "webLink", target: "_blank", children: [
+const j = ({ title: m, instantView: r }) => /* @__PURE__ */ l(p, { children: [
+  (r == null ? void 0 : r.video) && /* @__PURE__ */ o(e, { source: r.video.url, poster: r.video.thumbnailUrl }),
+  /* @__PURE__ */ l(c, { children: [
+    /* @__PURE__ */ o(h, { children: (r == null ? void 0 : r.heading) || m }),
+    /* @__PURE__ */ o(b, { children: r == null ? void 0 : r.body }),
+    (r == null ? void 0 : r.webLink) && /* @__PURE__ */ l(f, { href: "webLink", target: "_blank", children: [
       "Explore more of the Masters History",
-      /* @__PURE__ */ r(m, { name: "icon-external-link" })
+      /* @__PURE__ */ o(d, { name: "icon-external-link" })
     ] })
   ] })
 ] });
 export {
-  y as InsightDetails
+  j as InsightDetails
 };