Skip to content

Commit 672ccb8

Browse files
authored
Merge pull request #4 from calimania/feat/posthog
Added posthog support
2 parents a712cb9 + 8a7ef67 commit 672ccb8

File tree

6 files changed

+141
-66
lines changed

6 files changed

+141
-66
lines changed

.env.example

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
REACT_APP_STRAPI_URL=https://api.markket.place
22
REACT_APP_STORE_SLUG=summit
3+
REACT_APP_POSTHOG_KEY=

.github/workflows/build.yaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ on:
1010
env:
1111
REACT_APP_STRAPI_URL: ${{ secrets.STRAPI_URL }}
1212
REACT_APP_STORE_SLUG: ${{ secrets.STORE_SLUG }}
13+
REACT_APP_POSTHOG_KEY: ${{ secrets.POSTHOG_ID }}
1314

1415
permissions:
1516
contents: write

package-lock.json

Lines changed: 43 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"@types/react": "^19.0.10",
2222
"@types/react-dom": "^19.0.4",
2323
"embla-carousel-react": "^8.5.2",
24+
"posthog-js": "^1.231.0",
2425
"react": "^19.0.0",
2526
"react-dom": "^19.0.0",
2627
"react-markdown": "^10.1.0",

src/App.tsx

Lines changed: 20 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,19 @@ import { Store } from './api/store';
33
import { StrapiClient } from './api/api.strapi';
44
import {
55
Container,
6-
Title,
7-
Image,
86
Text,
9-
Stack,
10-
Paper,
11-
Group,
12-
Button,
137
MantineProvider,
148
Skeleton
159
} from '@mantine/core';
16-
import { IconWorld } from '@tabler/icons-react';
17-
import ReactMarkdown from 'react-markdown';
1810
import '@mantine/core/styles.css';
1911
import './styles/blocks.scss';
2012
import { Page } from './api/page';
21-
import PageContent from './components/page.content';
2213
import config from './config';
14+
import { PostHogProvider } from 'posthog-js/react'
15+
16+
import HomePage from './components/home.page';
17+
18+
const POSTHOG_API_KEY = process.env.REACT_APP_POSTHOG_KEY as string;
2319

2420
/**
2521
* Landing page component
@@ -80,63 +76,21 @@ function App() {
8076
);
8177
}
8278

83-
return (
84-
<MantineProvider >
85-
<Container size="md" py="xl" id={window.location.hash?.replace('#', '')}>
86-
<Paper shadow="md" radius="md" p="xl" mb="xl">
87-
<Stack align="center">
88-
{store.Logo && (
89-
<Image
90-
src={store.Logo.formats?.small?.url || store.Logo.url}
91-
alt={store.title}
92-
width={200}
93-
height={200}
94-
fit="contain"
95-
/>
96-
)}
97-
98-
<Title order={1}>
99-
{store.title}
100-
</Title>
101-
102-
{store.Description && (
103-
<div className="blocks-content">
104-
<ReactMarkdown >
105-
{store.Description}
106-
</ReactMarkdown>
107-
</div>
108-
)}
109-
110-
{store.URLS && store.URLS.length > 0 && (
111-
<Group mt="md">
112-
{store.URLS.map((url) => (
113-
<Button
114-
key={url.id}
115-
component="a"
116-
href={url.URL}
117-
target="_blank"
118-
variant="light"
119-
>
120-
<IconWorld size={18} />{` `}
121-
{url.Label}
122-
</Button>
123-
))}
124-
</Group>
125-
)}
126-
</Stack>
127-
</Paper>
128-
129-
</Container >
79+
if (POSTHOG_API_KEY) {
80+
return (
81+
<PostHogProvider apiKey={POSTHOG_API_KEY}>
82+
<MantineProvider>
83+
<HomePage homePage={homePage} store={store} />
84+
</MantineProvider>
85+
</PostHogProvider>
86+
);
87+
}
13088

131-
<Container>
132-
<div className="blocks-content">
133-
{homePage && (
134-
<PageContent params={{ page: homePage }} />
135-
)}
136-
</div>
137-
</Container>
138-
</MantineProvider >
139-
);
140-
}
89+
return (
90+
<MantineProvider>
91+
<HomePage homePage={homePage} store={store} />
92+
</MantineProvider>
93+
)
94+
};
14195

14296
export default App;

src/components/home.page.tsx

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
import React from 'react'
2+
import { Container, Paper, Stack, Image, Title, Button, Group } from '@mantine/core'
3+
import { IconHeartbeat } from '@tabler/icons-react'
4+
import ReactMarkdown from 'react-markdown'
5+
import PageContent from './page.content'
6+
import { Page } from '../api/page'
7+
import { Store } from '../api/store'
8+
9+
interface PageProps {
10+
homePage: Page | null;
11+
store: Store | null;
12+
}
13+
14+
15+
const PageComponent = ({homePage, store} : PageProps) => {
16+
return (
17+
<>
18+
<Container size="md" py="xl" id={window.location.hash?.replace('#', '')}>
19+
<Paper shadow="md" radius="md" p="xl" mb="xl">
20+
<Stack align="center">
21+
{store?.Logo && (
22+
<Image
23+
src={store.Logo.formats?.small?.url || store.Logo.url}
24+
alt={store.title}
25+
width={200}
26+
height={200}
27+
fit="contain"
28+
/>
29+
)}
30+
31+
<Title order={1}>
32+
{store?.title}
33+
</Title>
34+
35+
{store?.Description && (
36+
<div className="blocks-content">
37+
<ReactMarkdown >
38+
{store.Description}
39+
</ReactMarkdown>
40+
</div>
41+
)}
42+
43+
{store?.URLS?.length && (
44+
<Group mt="md">
45+
{store.URLS.map((url) => (
46+
<Button
47+
key={url.id}
48+
component="a"
49+
href={url.URL}
50+
target="_blank"
51+
variant="light"
52+
>
53+
<IconHeartbeat size={18} />{` `}
54+
{url.Label}
55+
</Button>
56+
))}
57+
</Group>
58+
)}
59+
</Stack>
60+
</Paper>
61+
62+
</Container >
63+
64+
<Container>
65+
<div className="blocks-content">
66+
{homePage && (
67+
<PageContent params={{ page: homePage }} />
68+
)}
69+
</div>
70+
</Container>
71+
</>
72+
)
73+
};
74+
75+
export default PageComponent;

0 commit comments

Comments
 (0)