@newskit-render/core 2.3.1 → 2.4.0

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@2.4.0-alpha.0...@newskit-render/core@2.4.0) (2022-10-11)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
+## [2.3.2](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@2.3.2-alpha.0...@newskit-render/core@2.3.2) (2022-10-07)
+
+**Note:** Version bump only for package @newskit-render/core
+
+
+
+
+
 ## [2.3.1](https://github.com/newscorp-ghfb/ncu-newskit-render/compare/@newskit-render/core@2.3.1-alpha.0...@newskit-render/core@2.3.1) (2022-10-06)
 
 **Note:** Version bump only for package @newskit-render/core

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newskit-render/core",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "description": "Newskit Render - Core package",
   "author": "",
   "license": "UNLICENSED",
@@ -40,13 +40,13 @@
     "@emotion/styled": "11.10.4",
     "@newskit-render/api": "^1.1.0",
     "@newskit-render/auth": "^1.0.1",
-    "@newskit-render/checkout": "^1.0.4",
+    "@newskit-render/checkout": "^1.0.6",
     "@newskit-render/feature-flags": "^1.0.0",
     "@newskit-render/feed": "^1.0.1",
-    "@newskit-render/my-account": "^3.3.1",
-    "@newskit-render/shared-components": "^1.2.0",
-    "@newskit-render/standalone-components": "^1.2.0",
-    "@newskit-render/validation": "^1.0.0",
+    "@newskit-render/my-account": "^3.4.1",
+    "@newskit-render/shared-components": "^1.3.0",
+    "@newskit-render/standalone-components": "^1.3.0",
+    "@newskit-render/validation": "^1.1.0",
     "cross-fetch": "3.1.5",
     "graphql": "15.6.0",
     "lodash.get": "4.4.2",

package/pages/_app.tsx

@@ -1,9 +1,7 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import React from 'react'
 import { AppContext as AppContextType, AppProps } from 'next/app'
 import Head from 'next/head'
 import { ThemeProvider, Global, styled } from 'newskit'
-import { SessionProvider } from '@newskit-render/auth'
 import {
   getFeatureFlags,
   FeatureFlagsContextProvider,
@@ -59,18 +57,16 @@ function MyApp({ Component, pageProps, featureFlags, tenant }: MyAppProps) {
           </Head>
           <InstrumentationContextProvider>
             <FeatureFlagsContextProvider context={featureFlags}>
-              <SessionProvider pageProps={(pageProps as unknown) as any}>
-                <AppContext.Consumer>
-                  {({ theme }) => (
-                    <ThemeProvider theme={theme}>
-                      <Global styles={GlobalStyling} />
-                      <PageContainer>
-                        <Component {...pageProps} />
-                      </PageContainer>
-                    </ThemeProvider>
-                  )}
-                </AppContext.Consumer>
-              </SessionProvider>
+              <AppContext.Consumer>
+                {({ theme }) => (
+                  <ThemeProvider theme={theme}>
+                    <Global styles={GlobalStyling} />
+                    <PageContainer>
+                      <Component {...pageProps} />
+                    </PageContainer>
+                  </ThemeProvider>
+                )}
+              </AppContext.Consumer>
             </FeatureFlagsContextProvider>
           </InstrumentationContextProvider>
         </>

package/pages/preview/[articleId]/version/[versionId]/index.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import useSWR from 'swr'
 import {
   Block,
   IndeterminateProgressIndicator,
@@ -8,26 +9,31 @@ import {
   toNewsKitIcon,
 } from 'newskit'
 import {
+  SessionProvider,
   PageWithAuth,
   getSession,
   signIn,
   signOut,
   CookieView,
 } from '@newskit-render/auth'
-import { createApolloClient, ClientTypes } from '@newskit-render/api'
+import {
+  createApolloClient,
+  ClientTypes,
+  getAcsCookie,
+} from '@newskit-render/api'
+import { Article } from '@newskit-render/standalone-components'
 import { getHost } from '@newskit-render/shared-components'
 import { Info } from '@emotion-icons/material/Info'
 import { GET_UNIVERSAL_ARTICLE } from '../../../../../queries'
 import ArticlePage from '../../../../../components/article'
-import {
-  highlights,
-  relatedArticles,
-} from '../../../../../helpers/mocks/articleMock'
+import { fetchUser } from '../../../../../helpers/getUser'
+import { getAccountQueryUrl } from '../../../../../constants'
 import { addCacheHeaders } from '../../../../../helpers/addCacheHeaders'
 import {
   twitterUsername as configTwitterUsername,
   gscId as configGscId,
 } from '../../../../../config'
+import { fetcher } from '../../../../../helpers/getRecommendations'
 
 const IconFilledInfo = toNewsKitIcon(Info)
 
@@ -38,7 +44,26 @@ const PreviewArticle = ({
   twitterUsername,
   siteHost,
   gscId,
+  user,
+  articleId,
+  ...props
 }) => {
+  let userId
+  if (typeof window !== 'undefined') {
+    userId = window?.utag?.data['cp.utag_main_v_id']
+  }
+  const highlitedArticles = []
+  const relatedArticles = []
+  const { data: recommendations } = useSWR<Article[]>(
+    `/api/recommendations/${articleId}/${userId}`,
+    fetcher
+  )
+
+  if (Array.isArray(recommendations)) {
+    highlitedArticles.push(...recommendations.slice(0, 4))
+    relatedArticles.push(...recommendations.slice(4, 12))
+  }
+
   const accessDeniedPage = (
     <Banner
       overrides={{ stylePreset: 'bannerNotice' }}
@@ -68,31 +93,38 @@ const PreviewArticle = ({
   )
 
   return (
-    <PageWithAuth onDenied={accessDeniedPage} isLoading={showOnLoading}>
-      <>
-        <CookieView>
-          <Button size="medium" onClick={() => signOut()}>
-            sign out
-          </Button>
-        </CookieView>
-        <ArticlePage
-          section={section}
-          articleURL={articleURL}
-          {...universalArticle}
-          siteHost={siteHost}
-          gscId={gscId}
-          twitterUsername={twitterUsername}
-          highlights={highlights}
-          relatedArticles={relatedArticles}
-        />
-      </>
-    </PageWithAuth>
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    <SessionProvider pageProps={(props as unknown) as any}>
+      <PageWithAuth onDenied={accessDeniedPage} isLoading={showOnLoading}>
+        <>
+          <CookieView>
+            <Button size="medium" onClick={() => signOut()}>
+              sign out
+            </Button>
+          </CookieView>
+          <ArticlePage
+            section={section}
+            articleURL={articleURL}
+            {...universalArticle}
+            siteHost={siteHost}
+            gscId={gscId}
+            twitterUsername={twitterUsername}
+            highlights={highlitedArticles}
+            relatedArticles={relatedArticles}
+            user={user}
+          />
+        </>
+      </PageWithAuth>
+    </SessionProvider>
   )
 }
 
 export async function getServerSideProps(context) {
   const apolloClient = await createApolloClient(ClientTypes.nkapi)
   const session = await getSession(context)
+  const acsCookie = context.req.headers.cookie
+    ? getAcsCookie(ClientTypes.main, context.req.headers.cookie)
+    : ''
   const siteHost = getHost(context.req)
   if (!session) {
     return {
@@ -103,10 +135,17 @@ export async function getServerSideProps(context) {
     params: { articleId, versionId },
   } = context
 
-  const { data } = await apolloClient.query({
-    query: GET_UNIVERSAL_ARTICLE,
-    variables: { publisher: 'DEMO', id: articleId, version: versionId },
-  })
+  const [{ data }, user] = await Promise.all([
+    apolloClient.query({
+      query: GET_UNIVERSAL_ARTICLE,
+      variables: {
+        publisher: 'DEMO',
+        id: articleId,
+        version: versionId,
+      },
+    }),
+    await fetchUser(acsCookie, getAccountQueryUrl(siteHost)),
+  ])
 
   addCacheHeaders(context.res)
   return {
@@ -117,6 +156,9 @@ export async function getServerSideProps(context) {
       twitterUsername: configTwitterUsername || '',
       siteHost,
       gscId: configGscId || '',
+      showAds: true,
+      user,
+      articleId,
     },
   }
 }

package/temp/_app.tsx

@@ -3,7 +3,6 @@ import React from 'react'
 import Head from 'next/head'
 import { ThemeProvider, Global, css, styled } from 'newskit'
 <% MODULE >
-import { SessionProvider } from '@newskit-render/auth'