@luxfi/core 4.4.9 → 4.4.11

Sign up to get free protection for your applications and to get access to all the features.
Files changed (84) hide show
  1. package/components/access-code-input.tsx +71 -71
  2. package/components/auth/auth-listener.tsx +23 -41
  3. package/components/auth/auth-token/clear-auth-token.tsx +12 -0
  4. package/components/auth/auth-token/set-auth-token.tsx +16 -0
  5. package/components/auth/common-auth-domains.ts +16 -15
  6. package/components/auth/login-panel.tsx +104 -117
  7. package/components/chat-widget.tsx +77 -77
  8. package/components/commerce/bag-button.tsx +67 -67
  9. package/components/commerce/checkout-panel/close-button.tsx +26 -26
  10. package/components/commerce/checkout-panel/dt-bag-carousel.tsx +36 -36
  11. package/components/commerce/checkout-panel/dt-checkout-panel.tsx +66 -66
  12. package/components/commerce/checkout-panel/index.tsx +123 -123
  13. package/components/commerce/checkout-panel/links-row.tsx +21 -21
  14. package/components/commerce/checkout-panel/mb-checkout-panel.tsx +55 -55
  15. package/components/commerce/checkout-panel/steps-indicator.tsx +39 -39
  16. package/components/commerce/checkout-panel/thank-you.tsx +18 -18
  17. package/components/commerce/desktop-bag-popup.tsx +78 -78
  18. package/components/commerce/mobile-bag-drawer.tsx +51 -51
  19. package/components/commerce/mobile-menu-toggle-button.tsx +35 -35
  20. package/components/commerce/mobile-nav-menu.tsx +64 -64
  21. package/components/contact-dialog/contact-form.tsx +112 -112
  22. package/components/contact-dialog/disclaimer.tsx +13 -13
  23. package/components/contact-dialog/index.tsx +64 -64
  24. package/components/copyright.tsx +21 -21
  25. package/components/footer.tsx +77 -77
  26. package/components/header/desktop.tsx +54 -54
  27. package/components/header/index.tsx +26 -26
  28. package/components/header/mobile.tsx +161 -161
  29. package/components/header/theme-toggle.tsx +26 -26
  30. package/components/icons/bag-icon.tsx +10 -10
  31. package/components/icons/github.tsx +14 -14
  32. package/components/icons/index.tsx +35 -35
  33. package/components/icons/lux-logo.tsx +10 -10
  34. package/components/icons/secure-delivery.tsx +13 -13
  35. package/components/icons/social-icon.tsx +35 -35
  36. package/components/icons/social-svg.css +3 -3
  37. package/components/icons/youtube-logo.tsx +59 -59
  38. package/components/index.ts +27 -27
  39. package/components/logo.tsx +81 -81
  40. package/components/mini-chart/index.tsx +7 -7
  41. package/components/mini-chart/mini-chart-props.ts +43 -43
  42. package/components/mini-chart/mini-chart.tsx +85 -85
  43. package/components/mini-chart/wrapper.tsx +23 -23
  44. package/components/not-found/index.tsx +27 -27
  45. package/components/not-found/not-found-content.mdx +5 -5
  46. package/components/root-layout.tsx +71 -71
  47. package/components/scripts.tsx +23 -23
  48. package/conf/index.ts +50 -50
  49. package/environment.d.ts +5 -5
  50. package/next/analytics/fpixel.ts +15 -15
  51. package/next/analytics/google-analytics.ts +13 -13
  52. package/next/analytics/index.ts +3 -3
  53. package/next/analytics/pixel-analytics.tsx +54 -54
  54. package/next/determine-device-mw.ts +16 -16
  55. package/next/font/get-app-router-font-classes.ts +12 -12
  56. package/next/font/load-and-return-lux-next-fonts-on-import.ts +68 -68
  57. package/next/font/next-font-desc.ts +27 -27
  58. package/next/font/pages-router-font-vars.tsx +18 -18
  59. package/next/head-metadata/from-next/metadata-types.ts +158 -158
  60. package/next/head-metadata/from-next/opengraph-types.ts +267 -267
  61. package/next/head-metadata/from-next/twitter-types.ts +92 -92
  62. package/next/head-metadata/index.tsx +208 -208
  63. package/package.json +73 -73
  64. package/server-actions/firebase-app.ts +14 -14
  65. package/server-actions/index.ts +5 -5
  66. package/server-actions/store-contact.ts +51 -51
  67. package/site-def/footer/community.tsx +67 -67
  68. package/site-def/footer/company.ts +37 -37
  69. package/site-def/footer/ecosystem.ts +37 -37
  70. package/site-def/footer/index.tsx +26 -26
  71. package/site-def/footer/legal.ts +28 -28
  72. package/site-def/footer/network.ts +45 -45
  73. package/site-def/footer/svg/warpcast-logo.svg +11 -11
  74. package/site-def/index.ts +2 -2
  75. package/site-def/main-nav.ts +35 -35
  76. package/site-def/site-def.ts +36 -36
  77. package/style/lux-colors.css +85 -85
  78. package/style/lux-global.css +30 -30
  79. package/tailwind/fontFamily.tailwind.lux.ts +18 -18
  80. package/tailwind/index.ts +2 -2
  81. package/tailwind/lux-tw-fonts.ts +39 -39
  82. package/tailwind/tailwind.config.lux-preset.ts +10 -10
  83. package/tsconfig.json +10 -10
  84. package/types/contact-info.ts +10 -10
@@ -1,8 +1,8 @@
1
- import MiniChart from './wrapper'
2
- // import { type MiniChartProps, type MiniChartDateRanges } from './mini-chart-props'
3
-
4
- export {
5
- MiniChart as default,
6
- // type MiniChartProps,
7
- // type MiniChartDateRanges
1
+ import MiniChart from './wrapper'
2
+ // import { type MiniChartProps, type MiniChartDateRanges } from './mini-chart-props'
3
+
4
+ export {
5
+ MiniChart as default,
6
+ // type MiniChartProps,
7
+ // type MiniChartDateRanges
8
8
  }
@@ -1,44 +1,44 @@
1
- import type { CSSProperties } from 'react'
2
-
3
- // https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime
4
- const enum MiniChartDateRangesValues {
5
- '1D',
6
- '1M',
7
- '3M',
8
- '12M',
9
- '60M',
10
- 'ALL',
11
- }
12
-
13
- type MiniChartDateRanges = keyof typeof MiniChartDateRangesValues
14
-
15
- interface MiniChartBaseProps {
16
- symbol: string
17
- exchange?: string
18
- dateRange: MiniChartDateRanges
19
- noTimeScale?: boolean
20
- width?: number | string
21
- height?: number | string
22
- locale?: string
23
- colorTheme?: "light" | "dark"
24
- // @ts-ignore // TODO
25
- lineColor?: CSSProperties["color"]
26
- // @ts-ignore // TODO
27
- topGradientColor?: CSSProperties["color"]
28
- // @ts-ignore // TODO
29
- bottomGradientColor?: CSSProperties["color"]
30
- isTransparent?: boolean
31
- autosize?: boolean
32
- chartOnly?: boolean
33
- largeChartUrl?: string
34
- }
35
-
36
- type MiniChartProps = {
37
- widgetProps: MiniChartBaseProps
38
- containerStyles?: CSSProperties
39
- }
40
-
41
- export {
42
- type MiniChartProps,
43
- type MiniChartDateRanges
1
+ import type { CSSProperties } from 'react'
2
+
3
+ // https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime
4
+ const enum MiniChartDateRangesValues {
5
+ '1D',
6
+ '1M',
7
+ '3M',
8
+ '12M',
9
+ '60M',
10
+ 'ALL',
11
+ }
12
+
13
+ type MiniChartDateRanges = keyof typeof MiniChartDateRangesValues
14
+
15
+ interface MiniChartBaseProps {
16
+ symbol: string
17
+ exchange?: string
18
+ dateRange: MiniChartDateRanges
19
+ noTimeScale?: boolean
20
+ width?: number | string
21
+ height?: number | string
22
+ locale?: string
23
+ colorTheme?: "light" | "dark"
24
+ // @ts-ignore // TODO
25
+ lineColor?: CSSProperties["color"]
26
+ // @ts-ignore // TODO
27
+ topGradientColor?: CSSProperties["color"]
28
+ // @ts-ignore // TODO
29
+ bottomGradientColor?: CSSProperties["color"]
30
+ isTransparent?: boolean
31
+ autosize?: boolean
32
+ chartOnly?: boolean
33
+ largeChartUrl?: string
34
+ }
35
+
36
+ type MiniChartProps = {
37
+ widgetProps: MiniChartBaseProps
38
+ containerStyles?: CSSProperties
39
+ }
40
+
41
+ export {
42
+ type MiniChartProps,
43
+ type MiniChartDateRanges
44
44
  }
@@ -1,85 +1,85 @@
1
- 'use client'
2
-
3
- import React, { useEffect, useRef } from 'react'
4
- import { type MiniChartProps } from './mini-chart-props'
5
-
6
- const MiniChart: React.FC<MiniChartProps> = ({
7
- widgetProps,
8
- containerStyles = {}
9
- }) => {
10
-
11
- const {
12
- symbol,
13
- exchange,
14
- lineColor,
15
- topGradientColor,
16
- bottomGradientColor,
17
- width,
18
- height,
19
- autosize,
20
- locale,
21
- ...rest
22
- } = widgetProps
23
-
24
- const symbolString = (exchange) ? `${exchange}:${symbol}` : symbol
25
-
26
- const containerRef = useRef<HTMLDivElement | null>(null)
27
-
28
- useEffect(() => {
29
- if (!containerRef.current) {
30
- return
31
- }
32
- const script = document.createElement('script')
33
- script.type = 'text/javascript'
34
- script.src = 'https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js'
35
- script.async = true
36
- script.onload = async () => {
37
- const iframe = containerRef.current?.querySelector('iframe')
38
- if (iframe && iframe instanceof Element) {
39
- iframe.style.colorScheme = 'normal'
40
- setTimeout(() => {
41
- const value = document.querySelector('#mini-symbol-overview-ticker')
42
- console.log("TICKER: " + value)
43
- }, 1200) // from experimentation
44
-
45
-
46
- }
47
-
48
- const copyDiv = document.querySelector('.tradingview-widget-copyright')
49
- if (copyDiv) {
50
- console.log("COPY: " + copyDiv)
51
- setTimeout(() => {
52
- copyDiv.classList.remove('invisible')
53
- }, 1200) // from experimentation
54
- }
55
- }
56
- const config = JSON.stringify({
57
- symbol: symbolString,
58
- width: autosize ? '100%' : (width || 350),
59
- height: autosize ? '100%' : (height || 220),
60
- locale: locale ?? 'en',
61
- isTransparent: 'true',
62
- trendLineColor: lineColor || 'rgba(41, 98, 255, 1)',
63
- underLineColor: topGradientColor || 'rgba(41, 98, 255, 0.3)',
64
- underLineBottomColor: bottomGradientColor || 'rgba(41, 98, 255, 0)',
65
- ...rest,
66
- })
67
- script.innerHTML = config
68
- containerRef.current.appendChild(script)
69
- return () => {
70
- while (containerRef.current?.firstChild) {
71
- containerRef.current.removeChild(containerRef.current.firstChild)
72
- }
73
- }
74
- }, [ JSON.stringify(widgetProps) ])
75
-
76
- return (<>
77
- <div style={containerStyles} className='tradingview-widget-container h-[150px]' ref={containerRef} />
78
- <div className='tradingview-widget-copyright border-t w-full invisible'>
79
- <a href={`https://www.tradingview.com/symbols/${symbol}${exchange ? `/?exchange=${exchange}` : '' }`} rel="noopener" target="_blank">
80
- <span className="text-[--hz-ui-primary]">{symbol} quotes</span></a>&nbsp;by TradingView
81
- </div>
82
- </>)
83
- }
84
-
85
- export default MiniChart
1
+ 'use client'
2
+
3
+ import React, { useEffect, useRef } from 'react'
4
+ import { type MiniChartProps } from './mini-chart-props'
5
+
6
+ const MiniChart: React.FC<MiniChartProps> = ({
7
+ widgetProps,
8
+ containerStyles = {}
9
+ }) => {
10
+
11
+ const {
12
+ symbol,
13
+ exchange,
14
+ lineColor,
15
+ topGradientColor,
16
+ bottomGradientColor,
17
+ width,
18
+ height,
19
+ autosize,
20
+ locale,
21
+ ...rest
22
+ } = widgetProps
23
+
24
+ const symbolString = (exchange) ? `${exchange}:${symbol}` : symbol
25
+
26
+ const containerRef = useRef<HTMLDivElement | null>(null)
27
+
28
+ useEffect(() => {
29
+ if (!containerRef.current) {
30
+ return
31
+ }
32
+ const script = document.createElement('script')
33
+ script.type = 'text/javascript'
34
+ script.src = 'https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js'
35
+ script.async = true
36
+ script.onload = async () => {
37
+ const iframe = containerRef.current?.querySelector('iframe')
38
+ if (iframe && iframe instanceof Element) {
39
+ iframe.style.colorScheme = 'normal'
40
+ setTimeout(() => {
41
+ const value = document.querySelector('#mini-symbol-overview-ticker')
42
+ console.log("TICKER: " + value)
43
+ }, 1200) // from experimentation
44
+
45
+
46
+ }
47
+
48
+ const copyDiv = document.querySelector('.tradingview-widget-copyright')
49
+ if (copyDiv) {
50
+ console.log("COPY: " + copyDiv)
51
+ setTimeout(() => {
52
+ copyDiv.classList.remove('invisible')
53
+ }, 1200) // from experimentation
54
+ }
55
+ }
56
+ const config = JSON.stringify({
57
+ symbol: symbolString,
58
+ width: autosize ? '100%' : (width || 350),
59
+ height: autosize ? '100%' : (height || 220),
60
+ locale: locale ?? 'en',
61
+ isTransparent: 'true',
62
+ trendLineColor: lineColor || 'rgba(41, 98, 255, 1)',
63
+ underLineColor: topGradientColor || 'rgba(41, 98, 255, 0.3)',
64
+ underLineBottomColor: bottomGradientColor || 'rgba(41, 98, 255, 0)',
65
+ ...rest,
66
+ })
67
+ script.innerHTML = config
68
+ containerRef.current.appendChild(script)
69
+ return () => {
70
+ while (containerRef.current?.firstChild) {
71
+ containerRef.current.removeChild(containerRef.current.firstChild)
72
+ }
73
+ }
74
+ }, [ JSON.stringify(widgetProps) ])
75
+
76
+ return (<>
77
+ <div style={containerStyles} className='tradingview-widget-container h-[150px]' ref={containerRef} />
78
+ <div className='tradingview-widget-copyright border-t w-full invisible'>
79
+ <a href={`https://www.tradingview.com/symbols/${symbol}${exchange ? `/?exchange=${exchange}` : '' }`} rel="noopener" target="_blank">
80
+ <span className="text-[--hz-ui-primary]">{symbol} quotes</span></a>&nbsp;by TradingView
81
+ </div>
82
+ </>)
83
+ }
84
+
85
+ export default MiniChart
@@ -1,23 +1,23 @@
1
- import React from 'react'
2
-
3
- import BaseChart from './mini-chart'
4
-
5
- const Wrapper: React.FC<{
6
- symbol: string,
7
- exchange?: string
8
- }> = ({
9
- symbol,
10
- exchange
11
- }) => (
12
- <BaseChart widgetProps ={{
13
- symbol,
14
- exchange,
15
- autosize: true,
16
- colorTheme: 'dark',
17
- lineColor: "rgb(114, 27, 228)",
18
- bottomGradientColor: "rgba(255, 255, 255, 0.1)",
19
- dateRange: '60M',
20
- }}/>
21
- )
22
-
23
- export default Wrapper
1
+ import React from 'react'
2
+
3
+ import BaseChart from './mini-chart'
4
+
5
+ const Wrapper: React.FC<{
6
+ symbol: string,
7
+ exchange?: string
8
+ }> = ({
9
+ symbol,
10
+ exchange
11
+ }) => (
12
+ <BaseChart widgetProps ={{
13
+ symbol,
14
+ exchange,
15
+ autosize: true,
16
+ colorTheme: 'dark',
17
+ lineColor: "rgb(114, 27, 228)",
18
+ bottomGradientColor: "rgba(255, 255, 255, 0.1)",
19
+ dateRange: '60M',
20
+ }}/>
21
+ )
22
+
23
+ export default Wrapper
@@ -1,27 +1,27 @@
1
- import React from 'react'
2
-
3
- import { ApplyTypography, Main } from '@hanzo/ui/primitives'
4
-
5
- import type { SiteDef } from '../../site-def'
6
- import Footer from '../footer'
7
- import Header from '../header'
8
-
9
- import NotFoundMDX from './not-found-content.mdx'
10
-
11
- const NotFound: React.FC<{
12
- header?: boolean
13
- siteDef: SiteDef
14
- }> = ({
15
- header=false,
16
- siteDef
17
- }) => (<>
18
- {header && <Header siteDef={siteDef}/>}
19
- <Main className='xs:h-[100svh] xs:px-8 sm:px-10 sm:h-[700px]'>
20
- <ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
21
- <NotFoundMDX />
22
- </ApplyTypography>
23
- </Main>
24
- <Footer siteDef={siteDef}/>
25
- </>)
26
-
27
- export default NotFound
1
+ import React from 'react'
2
+
3
+ import { ApplyTypography, Main } from '@hanzo/ui/primitives'
4
+
5
+ import type { SiteDef } from '../../site-def'
6
+ import Footer from '../footer'
7
+ import Header from '../header'
8
+
9
+ import NotFoundMDX from './not-found-content.mdx'
10
+
11
+ const NotFound: React.FC<{
12
+ header?: boolean
13
+ siteDef: SiteDef
14
+ }> = ({
15
+ header=false,
16
+ siteDef
17
+ }) => (<>
18
+ {header && <Header siteDef={siteDef}/>}
19
+ <Main className='xs:h-[100svh] xs:px-8 sm:px-10 sm:h-[700px]'>
20
+ <ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
21
+ <NotFoundMDX />
22
+ </ApplyTypography>
23
+ </Main>
24
+ <Footer siteDef={siteDef}/>
25
+ </>)
26
+
27
+ export default NotFound
@@ -1,5 +1,5 @@
1
- ### ...Huh?
2
- #### Sorry, we're fresh out of those.
3
- <br/>
4
- #### ...try something from the [Home Page](/)?
5
-
1
+ ### ...Huh?
2
+ #### Sorry, we're fresh out of those.
3
+ <br/>
4
+ #### ...try something from the [Home Page](/)?
5
+
@@ -1,71 +1,71 @@
1
- import React, { type PropsWithChildren } from 'react'
2
-
3
- import type { Viewport } from 'next'
4
-
5
- import { Toaster } from '@hanzo/ui/primitives'
6
-
7
- import Header from './header'
8
- import type SiteDef from '../site-def/site-def'
9
- import getAppRouterBodyFontClasses from '../next/font/get-app-router-font-classes'
10
- import { FacebookPixelHead } from '../next/analytics/pixel-analytics'
11
- import Scripts from './scripts'
12
-
13
- // Next 14: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#use-viewport-export
14
- const viewport = {
15
- themeColor: [
16
- { media: '(prefers-color-scheme: light)', color: 'white' },
17
- { media: '(prefers-color-scheme: dark)', color: 'black' },
18
- ],
19
- } satisfies Viewport
20
-
21
- /*
22
- These '.variable' fields are actually autogenerate css classnames that *define* the actual
23
- css variables ('--<ugly-name>') that one asks for in the tailwind classes.
24
- They are what make them available in the global scope. So this MUST
25
- be done like this for the tailwind font classes to work.
26
-
27
- (...not to be confused with the css var itself. This field should be named something else!)
28
- */
29
-
30
- /*
31
- re body: overflow-y-hidden overflow-x-hidden, h-full
32
- We cannot have these on body tag for scroll-snap to work on iOS!
33
- */
34
- const bodyClasses =
35
- 'bg-background text-foreground flex flex-col min-h-full' +
36
- getAppRouterBodyFontClasses()
37
-
38
- const RootLayout: React.FC<PropsWithChildren & {
39
- siteDef: SiteDef
40
- header?: boolean
41
- }> = ({
42
- header = true,
43
- siteDef,
44
- children,
45
- }) => (
46
- <html lang='en' suppressHydrationWarning className='hanzo-ui-dark-theme' style={{backgroundColor: '#000'}}>
47
- <head >
48
- {/* https://stackoverflow.com/a/75716588/11645689 */ }
49
- <base target='_blank' />
50
- <FacebookPixelHead/>
51
- </head>
52
- <body className={bodyClasses} style={{
53
- // Not sure why these got added (by my check in)
54
- // overflow: hidden here breaks scroll snap, see comment above
55
- //paddingRight: '0 !important',
56
- //maxWidth: '100vw',
57
- display: 'none', // see scripts.tsx
58
-
59
- }}>
60
- <Scripts/>
61
- {header && <Header siteDef={siteDef}/>}
62
- {children}
63
- <Toaster position='top-center' duration={3000}/>
64
- </body>
65
- </html>
66
- )
67
-
68
- export {
69
- RootLayout as default,
70
- viewport
71
- }
1
+ import React, { type PropsWithChildren } from 'react'
2
+
3
+ import type { Viewport } from 'next'
4
+
5
+ import { Toaster } from '@hanzo/ui/primitives'
6
+
7
+ import Header from './header'
8
+ import type SiteDef from '../site-def/site-def'
9
+ import getAppRouterBodyFontClasses from '../next/font/get-app-router-font-classes'
10
+ import { FacebookPixelHead } from '../next/analytics/pixel-analytics'
11
+ import Scripts from './scripts'
12
+
13
+ // Next 14: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#use-viewport-export
14
+ const viewport = {
15
+ themeColor: [
16
+ { media: '(prefers-color-scheme: light)', color: 'white' },
17
+ { media: '(prefers-color-scheme: dark)', color: 'black' },
18
+ ],
19
+ } satisfies Viewport
20
+
21
+ /*
22
+ These '.variable' fields are actually autogenerate css classnames that *define* the actual
23
+ css variables ('--<ugly-name>') that one asks for in the tailwind classes.
24
+ They are what make them available in the global scope. So this MUST
25
+ be done like this for the tailwind font classes to work.
26
+
27
+ (...not to be confused with the css var itself. This field should be named something else!)
28
+ */
29
+
30
+ /*
31
+ re body: overflow-y-hidden overflow-x-hidden, h-full
32
+ We cannot have these on body tag for scroll-snap to work on iOS!
33
+ */
34
+ const bodyClasses =
35
+ 'bg-background text-foreground flex flex-col min-h-full' +
36
+ getAppRouterBodyFontClasses()
37
+
38
+ const RootLayout: React.FC<PropsWithChildren & {
39
+ siteDef: SiteDef
40
+ header?: boolean
41
+ }> = ({
42
+ header = true,
43
+ siteDef,
44
+ children,
45
+ }) => (
46
+ <html lang='en' suppressHydrationWarning className='hanzo-ui-dark-theme' style={{backgroundColor: '#000'}}>
47
+ <head >
48
+ {/* https://stackoverflow.com/a/75716588/11645689 */ }
49
+ <base target='_blank' />
50
+ <FacebookPixelHead/>
51
+ </head>
52
+ <body className={bodyClasses} style={{
53
+ // Not sure why these got added (by my check in)
54
+ // overflow: hidden here breaks scroll snap, see comment above
55
+ //paddingRight: '0 !important',
56
+ //maxWidth: '100vw',
57
+ display: 'none', // see scripts.tsx
58
+
59
+ }}>
60
+ <Scripts/>
61
+ {header && <Header siteDef={siteDef}/>}
62
+ {children}
63
+ <Toaster position='top-center' duration={3000}/>
64
+ </body>
65
+ </html>
66
+ )
67
+
68
+ export {
69
+ RootLayout as default,
70
+ viewport
71
+ }
@@ -1,23 +1,23 @@
1
- 'use client'
2
-
3
- import { useEffect } from 'react'
4
- import { GoogleAnalytics } from '@next/third-parties/google'
5
- import { FacebookPixel } from '../next/analytics'
6
-
7
- const Scripts = () => {
8
-
9
- useEffect(() => {
10
- document.body.style.display = 'block'
11
- }, [])
12
-
13
- return (
14
- <>
15
- <FacebookPixel />
16
- <GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? ''} />
17
- </>
18
- )
19
- }
20
-
21
- export {
22
- Scripts as default
23
- }
1
+ 'use client'
2
+
3
+ import { useEffect } from 'react'
4
+ import { GoogleAnalytics } from '@next/third-parties/google'
5
+ import { FacebookPixel } from '../next/analytics'
6
+
7
+ const Scripts = () => {
8
+
9
+ useEffect(() => {
10
+ document.body.style.display = 'block'
11
+ }, [])
12
+
13
+ return (
14
+ <>
15
+ <FacebookPixel />
16
+ <GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? ''} />
17
+ </>
18
+ )
19
+ }
20
+
21
+ export {
22
+ Scripts as default
23
+ }