0
0
mirror of https://github.com/PostHog/posthog.git synced 2024-11-24 18:07:17 +01:00

Redefined shadow variable fixes (#4544)

This commit is contained in:
Marius Andra 2021-05-31 13:17:53 +02:00 committed by GitHub
parent 8ef727634e
commit 9314dd47c1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
26 changed files with 116 additions and 106 deletions

View File

@ -43,7 +43,7 @@ module.exports = {
'@typescript-eslint/no-empty-function': 'off',
'@typescript-eslint/no-inferrable-types': 'off',
'@typescript-eslint/ban-ts-comment': 'off',
'no-shadow': 'warn',
'no-shadow': 'error',
curly: 'error',
},
overrides: [

View File

@ -38,16 +38,16 @@ export function OperatorValueSelect({
<>
<Col {...(Array.isArray(columnOptions) ? columnOptions[0] : columnOptions)}>
<OperatorSelect
operator={currentOperator || 'exact'}
operator={currentOperator || PropertyOperator.Exact}
operators={Object.keys(operatorMap) as Array<PropertyOperator>}
onChange={(newOperator: PropertyOperator) => {
setCurrentOperator(newOperator)
if (isOperatorFlag(newOperator)) {
onChange(newOperator, newOperator)
} else if (isOperatorFlag(currentOperator || 'exact')) {
} else if (isOperatorFlag(currentOperator || PropertyOperator.Exact)) {
onChange(newOperator, null)
} else if (
isOperatorMulti(currentOperator || 'exact') &&
isOperatorMulti(currentOperator || PropertyOperator.Exact) &&
!isOperatorMulti(newOperator) &&
Array.isArray(value)
) {
@ -59,16 +59,16 @@ export function OperatorValueSelect({
{...operatorSelectProps}
/>
</Col>
{!isOperatorFlag(currentOperator || 'exact') && (
{!isOperatorFlag(currentOperator || PropertyOperator.Exact) && (
<Col {...(Array.isArray(columnOptions) ? columnOptions[1] : columnOptions)}>
<PropertyValue
type={type}
key={propkey}
propertyKey={propkey}
operator={currentOperator || 'exact'}
operator={currentOperator || PropertyOperator.Exact}
value={value}
onSet={(newValue: string | number | string[] | null) => {
onChange(currentOperator || 'exact', newValue)
onChange(currentOperator || PropertyOperator.Exact, newValue)
}}
/>
</Col>
@ -90,7 +90,7 @@ export function OperatorSelect({ operator, operators, onChange, ...props }: Oper
labelInValue
value={{
value: operator || '=',
label: operatorMap[operator || 'exact'],
label: operatorMap[operator || PropertyOperator.Exact],
}}
placeholder="Property key"
onChange={(_value, op) => {
@ -100,8 +100,8 @@ export function OperatorSelect({ operator, operators, onChange, ...props }: Oper
{...props}
>
{operators.map((op) => (
<Select.Option key={op} value={op || 'exact'}>
{operatorMap[op || 'exact']}
<Select.Option key={op} value={op || PropertyOperator.Exact}>
{operatorMap[op || PropertyOperator.Exact]}
</Select.Option>
))}
</Select>

View File

@ -151,7 +151,7 @@ export const selectBoxLogic = kea<selectBoxLogicType<SelectedItem, SelectBoxItem
for (const item of values.data) {
extraProps[`count_${item.key}`] = item.dataSource.length
if (item.key === 'events') {
extraProps.count_posthog_events = item.dataSource.filter((item) => item.name[0] === '$').length
extraProps.count_posthog_events = item.dataSource.filter(({ name }) => name[0] === '$').length
}
}
eventUsageLogic.actions.reportEventSearched(search, extraProps)

View File

@ -17,9 +17,9 @@ export function InsightDateFilter(props: DateFilterProps): JSX.Element {
{...props}
dateFrom={dateFrom}
dateTo={dateTo}
onChange={(dateFrom, dateTo) => {
setDates(dateFrom, dateTo)
props.onChange?.(dateFrom, dateTo)
onChange={(changedDateFrom, changedDateTo) => {
setDates(changedDateFrom, changedDateTo)
props.onChange?.(changedDateFrom, changedDateTo)
}}
/>
</span>

View File

@ -0,0 +1 @@
export * from './InsightDateFilter'

View File

@ -45,7 +45,7 @@ export function FunnelTab({ newUI }: FunnelTabProps): JSX.Element {
<h4 className="secondary">Steps</h4>
<ActionFilter
filters={filters}
setFilters={(filters: Record<string, any>): void => setFilters(filters, false)}
setFilters={(newFilters: Record<string, any>): void => setFilters(newFilters, false)}
typeKey={`EditFunnel-action`}
hideMathSelector={true}
buttonCopy="Add funnel step"

View File

@ -42,11 +42,11 @@ function DefaultRetentionTab(): JSX.Element {
const { setFilters } = useActions(retentionTableLogic({ dashboardItemId: null }))
const entityLogic = entityFilterLogic({
setFilters: (filters: FilterType) => {
if (filters.events && filters.events.length > 0) {
setFilters({ target_entity: filters.events[0] })
} else if (filters.actions && filters.actions.length > 0) {
setFilters({ target_entity: filters.actions[0] })
setFilters: (newFilters: FilterType) => {
if (newFilters.events && newFilters.events.length > 0) {
setFilters({ target_entity: newFilters.events[0] })
} else if (newFilters.actions && newFilters.actions.length > 0) {
setFilters({ target_entity: newFilters.actions[0] })
} else {
setFilters({ target_entity: null })
}
@ -58,11 +58,11 @@ function DefaultRetentionTab(): JSX.Element {
})
const entityLogicReturning = entityFilterLogic({
setFilters: (filters: FilterType) => {
if (filters.events && filters.events.length > 0) {
setFilters({ returning_entity: filters.events[0] })
} else if (filters.actions && filters.actions.length > 0) {
setFilters({ returning_entity: filters.actions[0] })
setFilters: (newFilters: FilterType) => {
if (newFilters.events && newFilters.events.length > 0) {
setFilters({ returning_entity: newFilters.events[0] })
} else if (newFilters.actions && newFilters.actions.length > 0) {
setFilters({ returning_entity: newFilters.actions[0] })
} else {
setFilters({ returning_entity: null })
}

View File

@ -36,11 +36,11 @@ export function RetentionTabHorizontal({ annotationsToCreate }: BaseTabProps): J
const isSmallScreen = screens.xs || (screens.sm && !screens.md)
const entityLogic = entityFilterLogic({
setFilters: (filters: FilterType) => {
if (filters.events && filters.events.length > 0) {
setFilters({ target_entity: filters.events[0] })
} else if (filters.actions && filters.actions.length > 0) {
setFilters({ target_entity: filters.actions[0] })
setFilters: (newFilters: FilterType) => {
if (newFilters.events && newFilters.events.length > 0) {
setFilters({ target_entity: newFilters.events[0] })
} else if (newFilters.actions && newFilters.actions.length > 0) {
setFilters({ target_entity: newFilters.actions[0] })
} else {
setFilters({ target_entity: null })
}
@ -52,11 +52,11 @@ export function RetentionTabHorizontal({ annotationsToCreate }: BaseTabProps): J
})
const entityLogicReturning = entityFilterLogic({
setFilters: (filters: FilterType) => {
if (filters.events && filters.events.length > 0) {
setFilters({ returning_entity: filters.events[0] })
} else if (filters.actions && filters.actions.length > 0) {
setFilters({ returning_entity: filters.actions[0] })
setFilters: (newFilters: FilterType) => {
if (newFilters.events && newFilters.events.length > 0) {
setFilters({ returning_entity: newFilters.events[0] })
} else if (newFilters.actions && newFilters.actions.length > 0) {
setFilters({ returning_entity: newFilters.actions[0] })
} else {
setFilters({ returning_entity: null })
}

View File

@ -27,13 +27,13 @@ export function Formula({
autoFocus={autoFocus}
value={value}
onChange={(e) => {
let value = e.target.value.toLocaleUpperCase()
let changedValue = e.target.value.toLocaleUpperCase()
// Only allow typing of allowed characters
value = value
changedValue = changedValue
.split('')
.filter((d) => /^[a-zA-Z\ \-\*\^0-9\+\/\(\)]+$/g.test(d))
.join('')
setValue(value)
setValue(changedValue)
}}
onFocus={() => onFocus && onFocus(true, value)}
onBlur={() => !filters.formula && onFocus && onFocus(false, value)}

View File

@ -102,15 +102,15 @@ export function LineGraph({
}, [myLineChart.current, size, type, annotationsCondition])
function calculateBoundaries() {
const leftExtent = myLineChart.current.scales['x-axis-0'].left
const rightExtent = myLineChart.current.scales['x-axis-0'].right
const ticks = myLineChart.current.scales['x-axis-0'].ticks.length
const delta = rightExtent - leftExtent
const interval = delta / (ticks - 1)
const topExtent = myLineChart.current.scales['x-axis-0'].top + 8
setLeftExtent(leftExtent)
setInterval(interval)
setTopExtent(topExtent)
const boundaryLeftExtent = myLineChart.current.scales['x-axis-0'].left
const boundaryRightExtent = myLineChart.current.scales['x-axis-0'].right
const boundaryTicks = myLineChart.current.scales['x-axis-0'].ticks.length
const boundaryDelta = boundaryRightExtent - boundaryLeftExtent
const boundaryInterval = boundaryDelta / (boundaryTicks - 1)
const boundaryTopExtent = myLineChart.current.scales['x-axis-0'].top + 8
setLeftExtent(boundaryLeftExtent)
setInterval(boundaryInterval)
setTopExtent(boundaryTopExtent)
}
function processDataset(dataset, index) {

View File

@ -20,9 +20,9 @@ export const SaveModal: React.FC<SaveChartModalProps> = (props) => {
onCancel()
}
function _onSubmit(input: string): void {
function _onSubmit(submittedInput: string): void {
setInput('')
onSubmit(input)
onSubmit(submittedInput)
}
return (

View File

@ -63,10 +63,10 @@ export function MergePerson({
{persons.results &&
persons.results
.filter((p) => p.uuid !== person.uuid)
.map((person) =>
person.id ? (
<Select.Option value={person.id} key={person.id}>
{person.name}
.map((p) =>
p.id ? (
<Select.Option value={p.id} key={p.id}>
{p.name}
</Select.Option>
) : undefined
)}

View File

@ -78,9 +78,9 @@ export function SessionDetails({ session }: { session: SessionType }): JSX.Eleme
hideOnSinglePage: !events || events.length < 10,
showSizeChanger: true,
pageSizeOptions: ['10', '20', '50', '100', '200', '500'],
onChange: (page, pageSize) => {
setPage(page)
setPageSize(pageSize || 50)
onChange: (changedPage, changedPageSize) => {
setPage(changedPage)
setPageSize(changedPageSize || 50)
},
}}
expandable={{

View File

@ -1,12 +1,12 @@
import React, { useState } from 'react'
import { useActions } from 'kea'
import { RecordingPropertyFilter } from '~/types'
import { PropertyOperator, RecordingDurationFilter } from '~/types'
import { Input, Select } from 'antd'
import { OperatorSelect } from 'lib/components/PropertyFilters/components/OperatorValueSelect'
import { sessionsFiltersLogic } from 'scenes/sessions/filters/sessionsFiltersLogic'
interface Props {
filter: RecordingPropertyFilter
filter: RecordingDurationFilter
selector: number
}
@ -25,9 +25,9 @@ export function DurationFilter({ filter, selector }: Props): JSX.Element {
<>
<OperatorSelect
operator={filter.operator}
operators={['gt', 'lt']}
operators={[PropertyOperator.GreaterThan, PropertyOperator.LessThan]}
onChange={(operator) => {
updateFilter({ ...filter, operator: operator as 'lt' | 'gt' }, selector)
updateFilter({ ...filter, operator }, selector)
}}
/>

View File

@ -3,7 +3,7 @@ import { Button, Card, Divider, Space } from 'antd'
import { useActions, useValues } from 'kea'
import { SaveOutlined, SearchOutlined } from '@ant-design/icons'
import { CloseButton } from 'lib/components/CloseButton'
import { Entity, EventTypePropertyFilter, PersonPropertyFilter, PropertyFilter, RecordingPropertyFilter } from '~/types'
import { Entity, PersonPropertyFilter, PropertyFilter } from '~/types'
import { sessionsFiltersLogic } from 'scenes/sessions/filters/sessionsFiltersLogic'
import { EventPropertyFilter } from 'scenes/sessions/filters/EventPropertyFilter'
import { PersonFilter } from 'scenes/sessions/filters/UserFilter'
@ -180,14 +180,12 @@ export function EditFiltersPanel({ onSubmit }: Props): JSX.Element | null {
</Button>
<SessionsFilterBox selector={selector} />
</div>
{['event_type', 'action_type'].includes(item.type) && (
<EventPropertyFilter filter={item as EventTypePropertyFilter} selector={selector} />
)}
{item.type === 'person' && (
<PersonFilter filter={item as PersonPropertyFilter} selector={selector} />
{(item.type === 'event_type' || item.type === 'action_type') && (
<EventPropertyFilter filter={item} selector={selector} />
)}
{item.type === 'person' && <PersonFilter filter={item} selector={selector} />}
{item.type === 'recording' && item.key === 'duration' && (
<DurationFilter filter={item as RecordingPropertyFilter} selector={selector} />
<DurationFilter filter={item} selector={selector} />
)}
</div>
{filters.length > 1 && andTag(index < filters.length - 1)}

View File

@ -1,14 +1,14 @@
import React from 'react'
import { useActions, useValues } from 'kea'
import { PropertySelect } from 'lib/components/PropertyFilters/components/PropertySelect'
import { EventTypePropertyFilter } from '~/types'
import { ActionTypePropertyFilter, EventTypePropertyFilter, PropertyOperator } from '~/types'
import { keyMapping } from 'lib/components/PropertyKeyInfo'
import { OperatorValueSelect } from 'lib/components/PropertyFilters/components/OperatorValueSelect'
import { sessionsFiltersLogic } from 'scenes/sessions/filters/sessionsFiltersLogic'
import { propertyDefinitionsLogic } from 'scenes/events/propertyDefinitionsLogic'
interface Props {
filter: EventTypePropertyFilter
filter: EventTypePropertyFilter | ActionTypePropertyFilter
selector: number
}
@ -36,7 +36,9 @@ export function EventPropertyFilter({ filter, selector }: Props): JSX.Element {
updateFilter(
{
...filter,
properties: [{ operator: 'exact', value: null, ...property, type: 'event', key }],
properties: [
{ operator: PropertyOperator.Exact, value: null, ...property, type: 'event', key },
],
},
selector
)
@ -49,11 +51,11 @@ export function EventPropertyFilter({ filter, selector }: Props): JSX.Element {
propkey={property.key}
operator={property.operator}
value={property.value}
onChange={(operator, value) => {
onChange={(operator, changedValue) => {
updateFilter(
{
...filter,
properties: [{ ...property, operator, value }],
properties: [{ ...property, operator, value: changedValue }],
},
selector
)

View File

@ -100,7 +100,7 @@ export function SessionsFilterBox({ selector }: { selector: FilterSelector }): J
id: cohort.id,
cohort,
})),
renderInfo: function cohorts({ item }) {
renderInfo: function renderCohorts({ item }) {
return (
<>
<UsergroupAddOutlined /> Cohorts
@ -144,7 +144,7 @@ export function SessionsFilterBox({ selector }: { selector: FilterSelector }): J
name: name,
usage_count: count,
})),
renderInfo: function userProperty({ item }) {
renderInfo: function renderUserProperty({ item }) {
return (
<>
<UsergroupAddOutlined /> User property

View File

@ -1,10 +1,10 @@
import { SessionsPropertyFilter } from '~/types'
import { PropertyOperator, SessionsPropertyFilter } from '~/types'
export const SESSIONS_WITH_RECORDINGS_FILTER: SessionsPropertyFilter = {
type: 'recording',
key: 'duration',
value: 0,
operator: 'gt',
operator: PropertyOperator.GreaterThan,
label: 'Recording duration',
}

View File

@ -4,7 +4,7 @@ import api from 'lib/api'
import { toast } from 'react-toastify'
import { SESSIONS_WITH_RECORDINGS_FILTER, SESSIONS_WITH_UNSEEN_RECORDINGS } from 'scenes/sessions/filters/constants'
import { sessionsFiltersLogicType } from './sessionsFiltersLogicType'
import { SessionsPropertyFilter } from '~/types'
import { PropertyOperator, SessionsPropertyFilter } from '~/types'
export type FilterSelector = number | string
@ -146,11 +146,13 @@ export const sessionsFiltersLogic = kea<
listeners: ({ actions, values }) => ({
dropdownSelected: ({ type, id, label }) => {
if (values.openFilter !== null) {
if (type === 'action_type' || type === 'event_type' || type === 'cohort') {
if (type === 'action_type' || type === 'event_type') {
actions.updateFilter({ type, key: 'id', value: id, label }, values.openFilter)
} else if (type === 'cohort') {
actions.updateFilter({ type, key: 'id', value: Number(id), label }, values.openFilter)
} else if (type === 'person') {
actions.updateFilter(
{ type, key: id.toString(), value: null, label, operator: 'exact' },
{ type, key: id.toString(), value: null, label, operator: PropertyOperator.Exact },
values.openFilter
)
} else if (type === 'recording' && id === 'duration') {

View File

@ -7,16 +7,16 @@ interface SelectorCountProps {
export function SelectorCount({ selector }: SelectorCountProps): JSX.Element {
const [matches, selectorError] = useMemo(() => {
let selectorError = false
let matches = 0
let _selectorError = false
let _matches = 0
if (selector) {
try {
matches = querySelectorAllDeep(selector).length
_matches = querySelectorAllDeep(selector).length
} catch {
selectorError = true
_selectorError = true
}
}
return [matches, selectorError]
return [_matches, _selectorError]
}, [selector])
return (

View File

@ -1,6 +1,6 @@
import React from 'react'
import { Button } from 'antd'
import { ActionStepType } from '~/types'
import { ActionStepType, ActionStepUrlMatching } from '~/types'
interface UrlMatchingToggleProps {
value?: ActionStepType['url_matching']
@ -13,14 +13,20 @@ export function UrlMatchingToggle({ value, onChange, style }: UrlMatchingToggleP
<Button.Group size="small" style={style}>
<Button
type={value === 'contains' ? 'primary' : 'default'}
onClick={() => onChange && onChange('contains')}
onClick={() => onChange && onChange(ActionStepUrlMatching.Contains)}
>
Contains
</Button>
<Button type={value === 'regex' ? 'primary' : 'default'} onClick={() => onChange && onChange('regex')}>
<Button
type={value === 'regex' ? 'primary' : 'default'}
onClick={() => onChange && onChange(ActionStepUrlMatching.Regex)}
>
Regex
</Button>
<Button type={value === 'exact' ? 'primary' : 'default'} onClick={() => onChange && onChange('exact')}>
<Button
type={value === 'exact' ? 'primary' : 'default'}
onClick={() => onChange && onChange(ActionStepUrlMatching.Exact)}
>
Exact match
</Button>
</Button.Group>

View File

@ -34,17 +34,17 @@ export function FocusRect({ rect }: { rect: DOMRect }): JSX.Element {
return (
<>
{rects.map((rect) => (
{rects.map((r) => (
<div
key={rect.id}
key={r.id}
style={{
position: 'absolute',
top: rect.y,
left: rect.x,
width: rect.w,
height: rect.h,
top: r.y,
left: r.x,
width: r.w,
height: r.h,
zIndex: 10,
background: rect.bg,
background: r.bg,
backgroundBlendMode: 'multiply',
transition: 'opacity 0.3s',
}}

View File

@ -1,6 +1,6 @@
import Simmer, { Simmer as SimmerType } from '@posthog/simmerjs'
import { cssEscape } from 'lib/utils/cssEscape'
import { ActionStepType, ElementType } from '~/types'
import { ActionStepType, ActionStepUrlMatching, ElementType } from '~/types'
import { ActionStepForm, BoxColor } from '~/toolbar/types'
import { querySelectorAllDeep } from 'query-selector-shadow-dom'
@ -54,7 +54,7 @@ export function elementToActionStep(element: HTMLElement, dataAttributes: string
text: getSafeText(element) || '',
selector: query || '',
url: window.location.protocol + '//' + window.location.host + window.location.pathname,
url_matching: 'exact',
url_matching: ActionStepUrlMatching.Exact,
}
}
@ -336,12 +336,13 @@ export function actionStepToAntdForm(step: ActionStepType, isNew = false): Actio
const newStep = {
...step,
url_matching: step.url_matching || 'exact',
url_matching: step.url_matching || ActionStepUrlMatching.Exact,
href_selected: typeof step.href !== 'undefined' && step.href !== null,
text_selected: typeof step.text !== 'undefined' && step.text !== null,
selector_selected: typeof step.selector !== 'undefined' && step.selector !== null,
url_selected: typeof step.url !== 'undefined' && step.url !== null,
}
return newStep
}

View File

@ -255,11 +255,11 @@ export type ActionStepProperties =
| ElementPropertyFilter
| CohortPropertyFilter
interface RecordingDurationFilter extends BasePropertyFilter {
export interface RecordingDurationFilter extends BasePropertyFilter {
type: 'recording'
key: 'duration'
value: number
operator: 'lt' | 'gt'
operator: PropertyOperator
}
interface RecordingNotViewedFilter extends BasePropertyFilter {
@ -269,7 +269,7 @@ interface RecordingNotViewedFilter extends BasePropertyFilter {
export type RecordingPropertyFilter = RecordingDurationFilter | RecordingNotViewedFilter
interface ActionTypePropertyFilter extends BasePropertyFilter {
export interface ActionTypePropertyFilter extends BasePropertyFilter {
type: typeof ACTION_TYPE
properties?: Array<EventPropertyFilter>
}

View File

@ -138,7 +138,7 @@
"sass-loader": "^10.0.1",
"style-loader": "^1.2.1",
"ts-node": "^9.1.1",
"typescript": "^4.2.4",
"typescript": "^4.3.2",
"webpack": "^4.46.0",
"webpack-cli": "^4.5.0",
"webpack-dev-server": "^3.11.2"

View File

@ -11772,10 +11772,10 @@ typedarray@^0.0.6:
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
typescript@^4.2.4:
version "4.2.4"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==
typescript@^4.3.2:
version "4.3.2"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.3.2.tgz#399ab18aac45802d6f2498de5054fcbbe716a805"
integrity sha512-zZ4hShnmnoVnAHpVHWpTcxdv7dWP60S2FsydQLV8V5PbS3FifjWFFRiHSWpDJahly88PRyV5teTSLoq4eG7mKw==
unbox-primitive@^1.0.0:
version "1.0.0"