Merge branch 'master' into fix-trends-line-mock

.dockerignore

@@ -34,3 +34,5 @@
 !share/GeoLite2-City.mmdb
 !hogvm/python
 !unit.json
+!plugin-transpiler/src
+!plugin-transpiler/*.*

.eslintrc.js

@@ -86,7 +86,7 @@ module.exports = {
             },
         ],
         'react/forbid-dom-props': [
-            1,
+            'warn',
             {
                 forbid: [
                     {
@@ -98,7 +98,7 @@ module.exports = {
             },
         ],
         'posthog/warn-elements': [
-            1,
+            'warn',
             {
                 forbid: [
                     {
@@ -110,10 +110,6 @@ module.exports = {
                         element: 'Col',
                         message: 'use flex utility classes instead - most of the time can simply be a plain <div>',
                     },
-                    {
-                        element: 'Space',
-                        message: 'use flex or space utility classes instead',
-                    },
                     {
                         element: 'Divider',
                         message: 'use <LemonDivider> instead',
@@ -150,7 +146,7 @@ module.exports = {
             },
         ],
         'react/forbid-elements': [
-            2,
+            'error',
             {
                 forbid: [
                     {
@@ -161,6 +157,10 @@ module.exports = {
                         element: 'Tabs',
                         message: 'use <LemonTabs> instead',
                     },
+                    {
+                        element: 'Space',
+                        message: 'use flex or space utility classes instead',
+                    },
                     {
                         element: 'Spin',
                         message: 'use Spinner instead',
@@ -200,9 +200,9 @@ module.exports = {
                 ],
             },
         ],
-        'no-constant-condition': 0,
-        'no-prototype-builtins': 0,
-        'no-irregular-whitespace': 0,
+        'no-constant-condition': 'off',
+        'no-prototype-builtins': 'off',
+        'no-irregular-whitespace': 'off',
     },
     overrides: [
         {

.github/actions/run-backend-tests/action.yml

@@ -53,14 +53,33 @@ runs:
           shell: bash
           id: hogql-parser-diff
           run: |
-              changed=$(git diff --quiet HEAD master -- hogql_parser/ && echo "false" || echo "true")
-              echo "::set-output name=changed::$changed"
+              git fetch --no-tags --prune --depth=1 origin
+              changed=$(git diff --quiet HEAD origin/master -- hogql_parser/ && echo "false" || echo "true")
+              echo "changed=$changed" >> $GITHUB_OUTPUT
 
         - name: Install SAML (python3-saml) dependencies
           shell: bash
           run: |
               sudo apt-get update && sudo apt-get install libxml2-dev libxmlsec1-dev libxmlsec1-openssl
 
+        - name: Install pnpm
+          uses: pnpm/action-setup@v2
+          with:
+              version: 8.x.x
+
+        - name: Set up Node.js
+          uses: actions/setup-node@v3
+          with:
+              node-version: 18
+              cache: pnpm
+
+        - name: Install plugin-transpiler
+          shell: bash
+          run: |
+              cd plugin-transpiler
+              pnpm install
+              pnpm run build
+
         - uses: syphar/restore-virtualenv@v1
           id: cache-backend-tests
           with:

.github/workflows/ci-backend.yml

@@ -68,6 +68,7 @@ jobs:
                         - mypy.ini
                         - pytest.ini
                         - frontend/src/queries/schema.json # Used for generating schema.py
+                        - plugin-transpiler/src # Used for transpiling plugins
                         # Make sure we run if someone is explicitly change the workflow
                         - .github/workflows/ci-backend.yml
                         - .github/actions/run-backend-tests/action.yml

.gitignore

@@ -55,3 +55,4 @@ gen/
 upgrade/
 hogvm/typescript/dist
 .wokeignore
+plugin-transpiler/dist

bin/docker-server-unit

@@ -10,4 +10,6 @@ trap 'rm -rf "$PROMETHEUS_MULTIPROC_DIR"' EXIT
 export PROMETHEUS_METRICS_EXPORT_PORT=8001
 export STATSD_PORT=${STATSD_PORT:-8125}
 
-exec /usr/local/bin/docker-entrypoint.sh unitd --no-daemon
+# We need to run as --user root so that nginx unit can proxy the control socket for stats
+# However each application is run as "nobody"
+exec /usr/local/bin/docker-entrypoint.sh unitd --no-daemon --user root

bin/unit_metrics.py

@@ -0,0 +1,78 @@
+import http.client
+import json
+from prometheus_client import CollectorRegistry, Gauge, multiprocess, generate_latest
+
+UNIT_CONNECTIONS_ACCEPTED_TOTAL = Gauge(
+    "unit_connections_accepted_total",
+    "",
+    multiprocess_mode="livesum",
+)
+UNIT_CONNECTIONS_ACTIVE = Gauge(
+    "unit_connections_active",
+    "",
+    multiprocess_mode="livesum",
+)
+UNIT_CONNECTIONS_CLOSED = Gauge(
+    "unit_connections_closed",
+    "",
+    multiprocess_mode="livesum",
+)
+UNIT_CONNECTIONS_IDLE = Gauge(
+    "unit_connections_idle",
+    "",
+    multiprocess_mode="livesum",
+)
+UNIT_CONNECTIONS_TOTAL = Gauge(
+    "unit_requests_total",
+    "",
+    multiprocess_mode="livesum",
+)
+UNIT_PROCESSES_RUNNING_GAUGE = Gauge(
+    "unit_application_processes_running", "", multiprocess_mode="livesum", labelnames=["application"]
+)
+UNIT_PROCESSES_STARTING_GAUGE = Gauge(
+    "unit_application_processes_starting", "", multiprocess_mode="livesum", labelnames=["application"]
+)
+UNIT_PROCESSES_IDLE_GAUGE = Gauge(
+    "unit_application_processes_idle", "", multiprocess_mode="livesum", labelnames=["application"]
+)
+UNIT_REQUESTS_ACTIVE_GAUGE = Gauge(
+    "unit_application_requests_active", "", multiprocess_mode="livesum", labelnames=["application"]
+)
+
+
+def application(environ, start_response):
+    connection = http.client.HTTPConnection("localhost:8081")
+    connection.request("GET", "/status")
+    response = connection.getresponse()
+
+    statj = json.loads(response.read())
+    connection.close()
+
+    UNIT_CONNECTIONS_ACCEPTED_TOTAL.set(statj["connections"]["accepted"])
+    UNIT_CONNECTIONS_ACTIVE.set(statj["connections"]["active"])
+    UNIT_CONNECTIONS_IDLE.set(statj["connections"]["idle"])
+    UNIT_CONNECTIONS_CLOSED.set(statj["connections"]["closed"])
+    UNIT_CONNECTIONS_TOTAL.set(statj["requests"]["total"])
+
+    for application in statj["applications"].keys():
+        UNIT_PROCESSES_RUNNING_GAUGE.labels(application=application).set(
+            statj["applications"][application]["processes"]["running"]
+        )
+        UNIT_PROCESSES_STARTING_GAUGE.labels(application=application).set(
+            statj["applications"][application]["processes"]["starting"]
+        )
+        UNIT_PROCESSES_IDLE_GAUGE.labels(application=application).set(
+            statj["applications"][application]["processes"]["idle"]
+        )
+        UNIT_REQUESTS_ACTIVE_GAUGE.labels(application=application).set(
+            statj["applications"][application]["requests"]["active"]
+        )
+
+    start_response("200 OK", [("Content-Type", "text/plain")])
+    # Create the prometheus multi-process metric registry here
+    # This will aggregate metrics we send from the Django app
+    # We prepend our unit metrics here.
+    registry = CollectorRegistry()
+    multiprocess.MultiProcessCollector(registry)
+    yield generate_latest(registry)

cypress/e2e/trends.cy.ts

@@ -140,7 +140,7 @@ describe('Trends', () => {
     it('Apply date filter', () => {
         cy.get('[data-attr=date-filter]').click()
         cy.get('div').contains('Yesterday').should('exist').click()
-        cy.get('.trends-insights-container .insight-empty-state').should('exist')
+        cy.get('[data-attr=trend-line-graph]').should('exist')
     })
 
     it('Apply property breakdown', () => {

frontend/src/exporter/Exporter.stories.tsx

@@ -38,7 +38,7 @@ const Template: StoryFn<typeof Exporter> = (props) => {
 }
 
 export const TrendsLineInsight: Story = Template.bind({})
-TrendsLineInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsLine.json') }
+TrendsLineInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsLine.json') }
 
 export const TrendsLineMultiInsight: Story = Template.bind({})
 TrendsLineMultiInsight.args = {
@@ -50,103 +50,103 @@ TrendsLineMultiInsight.parameters = {
 
 export const TrendsLineBreakdownInsight: Story = Template.bind({})
 TrendsLineBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsLineBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsLineBreakdown.json'),
 }
 
 export const TrendsBarInsight: Story = Template.bind({})
-TrendsBarInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsBar.json') }
+TrendsBarInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsBar.json') }
 
 export const TrendsBarBreakdownInsight: Story = Template.bind({})
 TrendsBarBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsBarBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsBarBreakdown.json'),
 }
 
 export const TrendsValueInsight: Story = Template.bind({})
-TrendsValueInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsValue.json') }
+TrendsValueInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsValue.json') }
 
 export const TrendsValueBreakdownInsight: Story = Template.bind({})
 TrendsValueBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsValueBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsValueBreakdown.json'),
 }
 
 export const TrendsAreaInsight: Story = Template.bind({})
-TrendsAreaInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsArea.json') }
+TrendsAreaInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsArea.json') }
 
 export const TrendsAreaBreakdownInsight: Story = Template.bind({})
 TrendsAreaBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsAreaBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsAreaBreakdown.json'),
 }
 
 export const TrendsNumberInsight: Story = Template.bind({})
-TrendsNumberInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsNumber.json') }
+TrendsNumberInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsNumber.json') }
 
 export const TrendsTableInsight: Story = Template.bind({})
-TrendsTableInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsTable.json') }
+TrendsTableInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsTable.json') }
 
 export const TrendsTableBreakdownInsight: Story = Template.bind({})
 TrendsTableBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsTableBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsTableBreakdown.json'),
 }
 
 export const TrendsPieInsight: Story = Template.bind({})
-TrendsPieInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsPie.json') }
+TrendsPieInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsPie.json') }
 
 export const TrendsPieBreakdownInsight: Story = Template.bind({})
 TrendsPieBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsPieBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsPieBreakdown.json'),
 }
 
 export const TrendsWorldMapInsight: Story = Template.bind({})
 TrendsWorldMapInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/trendsWorldMap.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/trendsWorldMap.json'),
 }
 
 export const FunnelLeftToRightInsight: Story = Template.bind({})
 FunnelLeftToRightInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelLeftToRight.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelLeftToRight.json'),
 }
 
 export const FunnelLeftToRightBreakdownInsight: Story = Template.bind({})
 FunnelLeftToRightBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelLeftToRightBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelLeftToRightBreakdown.json'),
 }
 
 export const FunnelTopToBottomInsight: Story = Template.bind({})
 FunnelTopToBottomInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelTopToBottom.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelTopToBottom.json'),
 }
 
 export const FunnelTopToBottomBreakdownInsight: Story = Template.bind({})
 FunnelTopToBottomBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelTopToBottomBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelTopToBottomBreakdown.json'),
 }
 
 export const FunnelHistoricalTrendsInsight: Story = Template.bind({})
 FunnelHistoricalTrendsInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelHistoricalTrends.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelHistoricalTrends.json'),
 }
 
 export const FunnelTimeToConvertInsight: Story = Template.bind({})
 FunnelTimeToConvertInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/funnelTimeToConvert.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/funnelTimeToConvert.json'),
 }
 
 export const RetentionInsight: Story = Template.bind({})
-RetentionInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/retention.json') }
+RetentionInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/retention.json') }
 
 export const RetentionBreakdownInsight: Story = Template.bind({})
 RetentionBreakdownInsight.args = {
-    insight: require('../mocks/fixtures/api/projects/:team_id/insights/retentionBreakdown.json'),
+    insight: require('../mocks/fixtures/api/projects/team_id/insights/retentionBreakdown.json'),
 }
 
 export const LifecycleInsight: Story = Template.bind({})
-LifecycleInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/lifecycle.json') }
+LifecycleInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/lifecycle.json') }
 
 export const StickinessInsight: Story = Template.bind({})
-StickinessInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/stickiness.json') }
+StickinessInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/stickiness.json') }
 
 export const UserPathsInsight: Story = Template.bind({})
-UserPathsInsight.args = { insight: require('../mocks/fixtures/api/projects/:team_id/insights/userPaths.json') }
+UserPathsInsight.args = { insight: require('../mocks/fixtures/api/projects/team_id/insights/userPaths.json') }
 
 export const Dashboard: Story = Template.bind({})
 Dashboard.args = { dashboard }

frontend/src/layout/navigation-3000/sidepanel/SidePanel.scss

@@ -20,7 +20,7 @@
             box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2);
 
             [theme='dark'] & {
-                box-shadow: 0px 0px 30px rgba(255, 255, 255, 0.1);
+                box-shadow: none;
             }
         }
 

frontend/src/lib/api.ts

@@ -573,6 +573,10 @@ class ApiRequest {
         return this.projectsDetail(teamId).addPathComponent('external_data_sources')
     }
 
+    public externalDataSource(sourceId: ExternalDataStripeSource['id'], teamId?: TeamType['id']): ApiRequest {
+        return this.externalDataSources(teamId).addPathComponent(sourceId)
+    }
+
     // Request finalization
     public async get(options?: ApiMethodOptions): Promise<any> {
         return await api.get(this.assembleFullUrl(), options)
@@ -1587,6 +1591,12 @@ const api = {
         ): Promise<ExternalDataStripeSourceCreatePayload> {
             return await new ApiRequest().externalDataSources().create({ data })
         },
+        async delete(sourceId: ExternalDataStripeSource['id']): Promise<void> {
+            await new ApiRequest().externalDataSource(sourceId).delete()
+        },
+        async reload(sourceId: ExternalDataStripeSource['id']): Promise<void> {
+            await new ApiRequest().externalDataSource(sourceId).withAction('reload').create()
+        },
     },
 
     dataWarehouseViewLinks: {