-
Notifications
You must be signed in to change notification settings - Fork 1.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Add frameworks to onboarding part 3 (#21158)
* svelte * missing export * export * webflow * vue * django * flag code
- Loading branch information
Showing
30 changed files
with
456 additions
and
7 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
13 changes: 13 additions & 0 deletions
13
frontend/src/scenes/onboarding/sdks/feature-flags/django.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import { SDKKey } from '~/types' | ||
|
|
||
| import { SDKInstallDjangoInstructions } from '../sdk-install-instructions' | ||
| import { FlagImplementationSnippet } from './flagImplementationSnippet' | ||
|
|
||
| export function FeatureFlagsDjangoInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallDjangoInstructions /> | ||
| <FlagImplementationSnippet sdkKey={SDKKey.PYTHON} /> | ||
| </> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
frontend/src/scenes/onboarding/sdks/feature-flags/svelte.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| import { SDKKey } from '~/types' | ||
|
|
||
| import { NodeInstallSnippet, NodeSetupSnippet } from '../sdk-install-instructions' | ||
| import { SDKInstallSvelteJSInstructions } from '../sdk-install-instructions/svelte' | ||
| import { FlagImplementationSnippet } from './flagImplementationSnippet' | ||
|
|
||
| export function FeatureFlagsSvelteInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallSvelteJSInstructions /> | ||
| <h3>Client-side rendering</h3> | ||
| <FlagImplementationSnippet sdkKey={SDKKey.JS_WEB} /> | ||
| <h3>Server-side rendering</h3> | ||
| <h4>Install</h4> | ||
| <NodeInstallSnippet /> | ||
| <h4>Configure</h4> | ||
| <NodeSetupSnippet /> | ||
| <FlagImplementationSnippet sdkKey={SDKKey.NODE_JS} /> | ||
| </> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import { SDKKey } from '~/types' | ||
|
|
||
| import { SDKInstallVueInstructions } from '../sdk-install-instructions/vue' | ||
| import { FlagImplementationSnippet } from './flagImplementationSnippet' | ||
|
|
||
| export function FeatureFlagsVueInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallVueInstructions /> | ||
| <FlagImplementationSnippet sdkKey={SDKKey.JS_WEB} /> | ||
| </> | ||
| ) | ||
| } |
13 changes: 13 additions & 0 deletions
13
frontend/src/scenes/onboarding/sdks/feature-flags/webflow.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import { SDKKey } from '~/types' | ||
|
|
||
| import { SDKInstallWebflowInstructions } from '../sdk-install-instructions/webflow' | ||
| import { FlagImplementationSnippet } from './flagImplementationSnippet' | ||
|
|
||
| export function FeatureFlagsWebflowInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallWebflowInstructions /> | ||
| <FlagImplementationSnippet sdkKey={SDKKey.JS_WEB} /> | ||
| </> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
frontend/src/scenes/onboarding/sdks/product-analytics/django.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| import { CodeSnippet, Language } from 'lib/components/CodeSnippet' | ||
|
|
||
| import { SDKInstallDjangoInstructions } from '../sdk-install-instructions' | ||
|
|
||
| function DjangoCaptureSnippet(): JSX.Element { | ||
| return ( | ||
| <CodeSnippet language={Language.Python}>{`import posthog | ||
| posthog.capture('test-id', 'test-event')`}</CodeSnippet> | ||
| ) | ||
| } | ||
|
|
||
| export function ProductAnalyticsDjangoInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallDjangoInstructions /> | ||
| <h3>Send an Event</h3> | ||
| <DjangoCaptureSnippet /> | ||
| </> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 11 additions & 0 deletions
11
frontend/src/scenes/onboarding/sdks/product-analytics/svelte.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import { SDKInstallSvelteJSInstructions } from '../sdk-install-instructions/svelte' | ||
| import { ProductAnalyticsAllJSFinalSteps } from './AllJSFinalSteps' | ||
|
|
||
| export function ProductAnalyticsSvelteJSInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallSvelteJSInstructions /> | ||
| <ProductAnalyticsAllJSFinalSteps /> | ||
| </> | ||
| ) | ||
| } |
11 changes: 11 additions & 0 deletions
11
frontend/src/scenes/onboarding/sdks/product-analytics/vue.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import { SDKInstallVueInstructions } from '../sdk-install-instructions/vue' | ||
| import { ProductAnalyticsAllJSFinalSteps } from './AllJSFinalSteps' | ||
|
|
||
| export function ProductAnalyticsVueInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallVueInstructions /> | ||
| <ProductAnalyticsAllJSFinalSteps /> | ||
| </> | ||
| ) | ||
| } |
11 changes: 11 additions & 0 deletions
11
frontend/src/scenes/onboarding/sdks/product-analytics/webflow.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import { SDKInstallWebflowInstructions } from '../sdk-install-instructions/webflow' | ||
| import { ProductAnalyticsAllJSFinalSteps } from './AllJSFinalSteps' | ||
|
|
||
| export function ProductAnalyticsWebflowInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <SDKInstallWebflowInstructions /> | ||
| <ProductAnalyticsAllJSFinalSteps /> | ||
| </> | ||
| ) | ||
| } |
55 changes: 55 additions & 0 deletions
55
frontend/src/scenes/onboarding/sdks/sdk-install-instructions/django.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| import { useValues } from 'kea' | ||
| import { CodeSnippet, Language } from 'lib/components/CodeSnippet' | ||
| import { apiHostOrigin } from 'lib/utils/apiHost' | ||
| import { teamLogic } from 'scenes/teamLogic' | ||
|
|
||
| function DjangoInstallSnippet(): JSX.Element { | ||
| return <CodeSnippet language={Language.Bash}>pip install posthog</CodeSnippet> | ||
| } | ||
|
|
||
| function DjangoAppConfigSnippet(): JSX.Element { | ||
| const { currentTeam } = useValues(teamLogic) | ||
|
|
||
| return ( | ||
| <CodeSnippet language={Language.Python}> | ||
| {`from django.apps import AppConfig | ||
| import posthog | ||
| class YourAppConfig(AppConfig): | ||
| name = "your_app_name" | ||
| def ready(self): | ||
| posthog.api_key = '${currentTeam?.api_token}' | ||
| posthog.host = '${apiHostOrigin()}'`} | ||
| </CodeSnippet> | ||
| ) | ||
| } | ||
|
|
||
| function DjangoSettingsSnippet(): JSX.Element { | ||
| return ( | ||
| <CodeSnippet language={Language.Python}> | ||
| {`INSTALLED_APPS = [ | ||
| # other apps | ||
| 'your_app_name.apps.MyAppConfig', # Add your app config | ||
| ] `} | ||
| </CodeSnippet> | ||
| ) | ||
| } | ||
|
|
||
| export function SDKInstallDjangoInstructions(): JSX.Element { | ||
| return ( | ||
| <> | ||
| <h3>Install</h3> | ||
| <DjangoInstallSnippet /> | ||
| <h3>Configure</h3> | ||
| <p> | ||
| Set the PostHog API key and host in your <code>AppConfig</code> in <code>apps.py</code> so that's it's | ||
| available everywhere: | ||
| </p> | ||
| <DjangoAppConfigSnippet /> | ||
| <p /> | ||
| Next, if you haven't done so already, make sure you add your <code>AppConfig</code> to your{' '} | ||
| <code>settings.py</code> under <code>INSTALLED_APPS</code>: | ||
| <DjangoSettingsSnippet /> | ||
| </> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.