From b0bd4ea565fddfe8c4e7adf61085915499d8e110 Mon Sep 17 00:00:00 2001 From: Jonathan Summers-Muir Date: Wed, 30 Mar 2022 15:59:15 +0200 Subject: [PATCH 1/3] Update DatePicker.stories.tsx --- studio/components/ui/DatePicker/DatePicker.stories.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/studio/components/ui/DatePicker/DatePicker.stories.tsx b/studio/components/ui/DatePicker/DatePicker.stories.tsx index a01b3012be2..e0fdbf3deda 100644 --- a/studio/components/ui/DatePicker/DatePicker.stories.tsx +++ b/studio/components/ui/DatePicker/DatePicker.stories.tsx @@ -1,7 +1,5 @@ import React, { useState } from 'react' -import { IconLogIn } from '../Icon/icons/IconLogIn' - import { DatePicker } from '.' import ReactDatePicker from 'react-datepicker' From 5bb6f3950a9463412bccb87d218640f628c6f2dc Mon Sep 17 00:00:00 2001 From: Jonathan Summers-Muir Date: Wed, 30 Mar 2022 15:59:44 +0200 Subject: [PATCH 2/3] :any --- studio/components/ui/DatePicker/DatePicker.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/studio/components/ui/DatePicker/DatePicker.stories.tsx b/studio/components/ui/DatePicker/DatePicker.stories.tsx index e0fdbf3deda..c88c49a8b9e 100644 --- a/studio/components/ui/DatePicker/DatePicker.stories.tsx +++ b/studio/components/ui/DatePicker/DatePicker.stories.tsx @@ -17,7 +17,7 @@ export const Default = (args: any) => ( export const Simple = () => { const [startDate, setStartDate] = useState(new Date()) const [endDate, setEndDate] = useState(null) - const onChange = (dates) => { + const onChange = (dates: any) => { const [start, end] = dates setStartDate(start) setEndDate(end) From dbb67fef0599b565a353fea28b96aa3f5a98ad74 Mon Sep 17 00:00:00 2001 From: Jonathan Summers-Muir Date: Wed, 30 Mar 2022 16:15:06 +0200 Subject: [PATCH 3/3] mild fixes... --- .../components/ui/DatePicker/DatePicker.tsx | 2 +- .../ui/DatePicker/DateSplitInput.tsx | 264 ------------------ .../pages/project/[ref]/database/api-logs.tsx | 1 + .../project/[ref]/database/postgres-logs.tsx | 1 + .../project/[ref]/functions/[id]/details.tsx | 4 +- .../project/[ref]/functions/[id]/index.tsx | 61 +--- .../project/[ref]/functions/[id]/logs-old.tsx | 2 + .../pages/project/[ref]/functions/index.tsx | 21 +- .../interfaces/FunctionsListItem.tsx | 12 +- .../functions/interfaces/FunctionsNav.tsx | 1 + .../project/[ref]/logs-explorer/sources.tsx | 1 + studio/stores/RootStore.ts | 3 + studio/stores/content/ProjectContentStore.ts | 1 + .../stores/functions/ProjectFunctionsStore.ts | 1 + 14 files changed, 31 insertions(+), 344 deletions(-) delete mode 100644 studio/components/ui/DatePicker/DateSplitInput.tsx diff --git a/studio/components/ui/DatePicker/DatePicker.tsx b/studio/components/ui/DatePicker/DatePicker.tsx index c9012856a22..3b53c88c482 100644 --- a/studio/components/ui/DatePicker/DatePicker.tsx +++ b/studio/components/ui/DatePicker/DatePicker.tsx @@ -20,7 +20,7 @@ import { import { format } from 'date-fns' import TimeSplitInput from './TimeSplitInput' -import DateSplitInput from './DateSplitInput' +// import DateSplitInput from './DateSplitInput' import DividerSlash from './DividerSlash' import dayjs from 'dayjs' diff --git a/studio/components/ui/DatePicker/DateSplitInput.tsx b/studio/components/ui/DatePicker/DateSplitInput.tsx deleted file mode 100644 index aeeda582845..00000000000 --- a/studio/components/ui/DatePicker/DateSplitInput.tsx +++ /dev/null @@ -1,264 +0,0 @@ -import React, { useState } from 'react' -import { IconClock } from '@supabase/ui' -import DividerSlash from './DividerSlash' - -import { format } from 'date-fns' -import { DateType } from './DatePicker.types' -import dayjs from 'dayjs' - -var advancedFormat = require('dayjs/plugin/advancedFormat') -var utc = require('dayjs/plugin/utc') -var timezone = require('dayjs/plugin/timezone') // dependent on utc plugin - -dayjs.extend(advancedFormat) -dayjs.extend(utc) -dayjs.extend(timezone) -dayjs.tz.guess() - -// type TimeType = 'DD' | 'MM' | 'YYYY' - -// type Time = { -// HH: string -// mm: string -// ss: string -// } - -interface TimeSplitInputProps { - date: string - // setTime: (x: Time) => void - type: 'start' | 'end' - // setStartTime: (x: Time) => void - // setEndTime: (x: Time) => void - // startTime: Time - // endTime: Time - startDate: any - endDate: any - setDate: ({}) => void -} - -const DateSplitInput = ({ - type, - date, - // setTime, - // setStartTime, - // setEndTime, - // startTime, - // endTime, - startDate, - endDate, - setDate, -}: TimeSplitInputProps) => { - const [focus, setFocus] = useState(false) - - const [splitDate, setSplitDate] = useState({ - DD: format(new Date(date), 'dd'), - MM: format(new Date(date), 'MM'), - YYYY: format(new Date(date), 'yyyy'), - }) - - function handleOnChange() { - // console.log('handleOnChange') - - const payload = { - DD: splitDate.DD, - MM: splitDate.MM, - YYYY: splitDate.YYYY, - } - - // if (Number(payload.YYYY) > 2021) { - // payload.YYYY = 2021 - // } - // if (value.length > 2) return - - // switch (valueType) { - // case 'DD': - // if (value && Number(value) > 23) return - // break - // case 'MM': - // if (value && Number(value) > 59) return - // break - // case 'YYYY': - // if (value && Number(value) > 59) return - // break - // default: - // break - // } - - // console.log('got here') - - // payload[valueType] = value - - const dns_format = new Date(Number(payload.YYYY), Number(payload.MM), Number(payload.DD)) - - // console.log('format:', dns_format) - - setDate(dns_format) - } - - function sanitize(valueType: DateType) { - // console.log('handle blur') - const _time = splitDate - // console.log('_time.MM.length', _time.MM.length) - - if (_time.DD.length === 1) _time.DD = '0' + _time.DD - if (_time.MM.length === 1) _time.MM = '0' + _time.MM - if (_time.YYYY.length === 1) _time.YYYY = '0' + _time.YYYY - - if (!_time.DD) _time.DD = '00' - if (!_time.MM) _time.MM = '00' - if (!_time.YYYY) _time.YYYY = '00' - - // console.log('_time', _time) - - let endTimeChanges = false - let endTimePayload = endTime - - let startTimeChanges = false - let startTimePayload = startTime - - // Only run time conflicts if - // startDate and endDate are the same date - - // console.log(startDate) - // console.log(endDate) - if (format(new Date(startDate), 'dd/mm/yyyy') == format(new Date(endDate), 'dd/mm/yyyy')) { - // checks if start time is ahead of end time - - if (type === 'start') { - // console.log('HH in start switch') - if (_time.MM && Number(_time.MM) > Number(endTime.HH)) { - endTimePayload.HH = _time.MM - endTimeChanges = true - } - - if ( - // also check the hour - _time.MM && - Number(_time.MM) >= Number(endTime.HH) && - // check the minutes - _time.MM && - Number(_time.MM) > Number(endTime.mm) - ) { - endTimePayload.mm = _time.MM - endTimeChanges = true - } - - if ( - // also check the hour - _time.MM && - Number(_time.MM) >= Number(endTime.HH) && - // check the minutes - _time.MM && - Number(_time.MM) >= Number(endTime.mm) && - // check the seconds - _time.YYYY && - Number(_time.YYYY) > Number(endTime.ss) - ) { - endTimePayload.ss = _time.YYYY - endTimeChanges = true - } - } - - if (type === 'end') { - // console.log('HH in start switch') - - if (_time.MM && Number(_time.MM) < Number(startTime.HH)) { - startTimePayload.HH = _time.MM - startTimeChanges = true - } - - if ( - // also check the hour - _time.MM && - Number(_time.MM) <= Number(startTime.HH) && - // check the minutes - _time.MM && - Number(_time.MM) < Number(startTime.mm) - ) { - startTimePayload.mm = _time.MM - startTimeChanges = true - } - - if ( - // also check the hour - _time.MM && - Number(_time.MM) <= Number(startTime.HH) && - // check the minutes - _time.MM && - Number(_time.MM) <= Number(startTime.mm) && - // check the seconds - _time.YYYY && - Number(_time.YYYY) < Number(startTime.ss) - ) { - startTimePayload.ss = _time.YYYY - startTimeChanges = true - } - } - } - - setTime({ ..._time }) - - if (endTimeChanges) { - setEndTime({ ...endTimePayload }) - } - if (startTimeChanges) { - setStartTime({ ...startTimePayload }) - } - - setFocus(false) - } - - const handleFocus = (event: React.FocusEvent) => { - event.target.select() - setFocus(true) - } - - return ( -
- handleOnChange()} - onFocus={handleFocus} - pattern="[0-31]*" - placeholder="00" - maxLength={2} - onChange={(e) => setSplitDate({ ...splitDate, DD: e.target.value })} - aria-label="Days" - className="text-scale-1200 w-5 bg-transparent text-center outline-none" - value={splitDate.DD} - /> - - handleOnChange()} - onFocus={handleFocus} - pattern="[0-12]*" - placeholder="00" - maxLength={2} - onChange={(e) => setSplitDate({ ...splitDate, MM: e.target.value })} - aria-label="Months" - className="text-scale-1200 w-5 bg-transparent text-center outline-none" - value={splitDate.MM} - /> - - handleOnChange()} - onFocus={handleFocus} - pattern="[2021-2022]*" - placeholder="00" - maxLength={4} - minLength={4} - onChange={(e) => setSplitDate({ ...splitDate, YYYY: e.target.value })} - aria-label="Years" - className="text-scale-1200 w-8 bg-transparent text-center outline-none" - value={splitDate.YYYY} - /> -
- ) -} - -export default DateSplitInput diff --git a/studio/pages/project/[ref]/database/api-logs.tsx b/studio/pages/project/[ref]/database/api-logs.tsx index 949beeb037e..9178054c7a7 100644 --- a/studio/pages/project/[ref]/database/api-logs.tsx +++ b/studio/pages/project/[ref]/database/api-logs.tsx @@ -16,6 +16,7 @@ export const LogPage: NextPage = () => { diff --git a/studio/pages/project/[ref]/database/postgres-logs.tsx b/studio/pages/project/[ref]/database/postgres-logs.tsx index d97743f8c81..291cd5751d1 100644 --- a/studio/pages/project/[ref]/database/postgres-logs.tsx +++ b/studio/pages/project/[ref]/database/postgres-logs.tsx @@ -16,6 +16,7 @@ export const LogPage: NextPage = () => { diff --git a/studio/pages/project/[ref]/functions/[id]/details.tsx b/studio/pages/project/[ref]/functions/[id]/details.tsx index 58e68b0eeed..2a7c9f2cfdc 100644 --- a/studio/pages/project/[ref]/functions/[id]/details.tsx +++ b/studio/pages/project/[ref]/functions/[id]/details.tsx @@ -196,9 +196,9 @@ const PageLayout = () => {

Command line access

-
Deployment management
+
Deployment management
-
Secrets management
+
Secrets management
diff --git a/studio/pages/project/[ref]/functions/[id]/index.tsx b/studio/pages/project/[ref]/functions/[id]/index.tsx index fd5a5022103..ba8a205b25c 100644 --- a/studio/pages/project/[ref]/functions/[id]/index.tsx +++ b/studio/pages/project/[ref]/functions/[id]/index.tsx @@ -1,45 +1,20 @@ import { observer } from 'mobx-react-lite' import { withAuth } from 'hooks' -// import FunctionLayout from './../interfaces/FunctionLayout' - -// const PageLayout = () => { -// return Metrics -// } - import useSWR from 'swr' import dayjs from 'dayjs' -import Link from 'next/link' -import { FC, useState } from 'react' + +import { useState } from 'react' import { useRouter } from 'next/router' -import { - IconArchive, - IconDatabase, - IconKey, - IconZap, - Typography, - Button, - Dropdown, - IconChevronDown, -} from '@supabase/ui' +import { Button } from '@supabase/ui' import Panel from 'components/to-be-cleaned/Panel' import ChartHandler from 'components/to-be-cleaned/Charts/ChartHandler' -import { ProjectUsageMinimal } from 'components/to-be-cleaned/Usage' -import { useFlag } from 'hooks' import { get } from 'lib/common/fetch' -import { API_URL, METRICS, DATE_FORMAT } from 'lib/constants' -import Table from 'components/to-be-cleaned/Table' -import StackedAreaChart from 'components/ui/Charts/StackedAreaChart' -import { USAGE_COLORS } from 'components/ui/Charts/Charts.constants' -import { - EndpointResponse, - PathsDatum, - StatusCodesDatum, -} from 'components/interfaces/Home/ChartData.types' +import { API_URL, DATE_FORMAT } from 'lib/constants' + import FunctionLayout from '../interfaces/FunctionLayout' -// import { EndpointResponse, PathsDatum, StatusCodesDatum } from ' ChartData.types' const CHART_INTERVALS = [ { @@ -154,6 +129,8 @@ const PageLayout = () => {
+ {/* + // @ts-ignore */} { + {/* + // @ts-ignore */} {
+ {/* + // @ts-ignore */} { ) } -// export default ProjectUsage - -const PanelHeader = (props: any) => { - const Tag = props?.href ? Link : 'div' - return ( - -
- {props.icon} - -

{props.title}

- -
- - ) -} export default withAuth(observer(PageLayout)) diff --git a/studio/pages/project/[ref]/functions/[id]/logs-old.tsx b/studio/pages/project/[ref]/functions/[id]/logs-old.tsx index 652ba2e6145..2ea9a01b332 100644 --- a/studio/pages/project/[ref]/functions/[id]/logs-old.tsx +++ b/studio/pages/project/[ref]/functions/[id]/logs-old.tsx @@ -170,6 +170,8 @@ const FunctionsList = () => {
IP Address
+ {/* + // @ts-ignore */} {LogsData[0].ip_address}
diff --git a/studio/pages/project/[ref]/functions/index.tsx b/studio/pages/project/[ref]/functions/index.tsx index 2b1dfd80bfb..ed2c6324ba5 100644 --- a/studio/pages/project/[ref]/functions/index.tsx +++ b/studio/pages/project/[ref]/functions/index.tsx @@ -2,29 +2,16 @@ import { observer } from 'mobx-react-lite' import { useStore, withAuth } from 'hooks' import FunctionsLayout from './interfaces/FunctionsLayout' -import { - Button, - IconBookOpen, - IconChevronRight, - IconClipboard, - IconCopy, - IconExternalLink, - IconGlobe, - IconSearch, - IconTerminal, - Input, - Loading, -} from '@supabase/ui' -import { useEffect, useState } from 'react' +import { Button, IconBookOpen, IconSearch, IconTerminal, Input, Loading } from '@supabase/ui' +import { useEffect } from 'react' import Table from 'components/to-be-cleaned/Table' -import { memoryUsage } from 'process' + import FunctionsListItem from './interfaces/FunctionsListItem' import { useRouter } from 'next/router' import { post } from 'lib/common/fetch' import { API_URL, PROJECT_STATUS } from 'lib/constants' -import { useProjectFunctionsStore } from 'stores/projectFunctionsStore' -import { toJS } from 'mobx' + import CommandRender from './interfaces/CommandRender' import Link from 'next/link' diff --git a/studio/pages/project/[ref]/functions/interfaces/FunctionsListItem.tsx b/studio/pages/project/[ref]/functions/interfaces/FunctionsListItem.tsx index bce9c551c5a..27d4d31398d 100644 --- a/studio/pages/project/[ref]/functions/interfaces/FunctionsListItem.tsx +++ b/studio/pages/project/[ref]/functions/interfaces/FunctionsListItem.tsx @@ -1,18 +1,10 @@ import dayjs from 'dayjs' import { FC } from 'react' import { observer } from 'mobx-react-lite' -import { - Badge, - IconClipboard, - IconExternalLink, - IconGlobe, - Icon_function, - Typography, -} from '@supabase/ui' +import { IconClipboard, IconGlobe } from '@supabase/ui' import Table from 'components/to-be-cleaned/Table' -import SimpleCodeBlock from 'components/to-be-cleaned/SimpleCodeBlock' -import router, { useRouter } from 'next/router' +import { useRouter } from 'next/router' import { useStore } from 'hooks' // import _functionDropdown from './_functionDropdown' diff --git a/studio/pages/project/[ref]/functions/interfaces/FunctionsNav.tsx b/studio/pages/project/[ref]/functions/interfaces/FunctionsNav.tsx index e398d795e21..01dd022b961 100644 --- a/studio/pages/project/[ref]/functions/interfaces/FunctionsNav.tsx +++ b/studio/pages/project/[ref]/functions/interfaces/FunctionsNav.tsx @@ -1,6 +1,7 @@ import { Tabs } from '@supabase/ui' import { useRouter } from 'next/router' +// @ts-ignore const FunctionsNav = ({ item }) => { const router = useRouter() const activeRoute = router.pathname.split('/')[5] diff --git a/studio/pages/project/[ref]/logs-explorer/sources.tsx b/studio/pages/project/[ref]/logs-explorer/sources.tsx index fa6fb66cd6b..a65cac6f0a4 100644 --- a/studio/pages/project/[ref]/logs-explorer/sources.tsx +++ b/studio/pages/project/[ref]/logs-explorer/sources.tsx @@ -11,6 +11,7 @@ import CardButton from 'components/ui/CardButton' export const LogsExplorerPage: NextPage = () => { const router = useRouter() const { ref } = router.query + // @ts-ignore const sources = Object.values(LogsTableName).sort((a, b) => a - b) return ( diff --git a/studio/stores/RootStore.ts b/studio/stores/RootStore.ts index 6fda81a866e..3b9386fab4d 100644 --- a/studio/stores/RootStore.ts +++ b/studio/stores/RootStore.ts @@ -29,6 +29,7 @@ export class RootStore implements IRootStore { constructor() { this.ui = new UiStore(this) + // @ts-ignore this.content = new ProjectContentStore(this, { projectRef: '' }) this.functions = new ProjectFunctionsStore(this, { projectRef: '' }) this.meta = new MetaStore(this, { @@ -49,6 +50,7 @@ export class RootStore implements IRootStore { () => this.ui.selectedProject, (selectedProject) => { if (selectedProject) { + // @ts-ignore this.content = new ProjectContentStore(this, { projectRef: selectedProject.ref }) this.functions = new ProjectFunctionsStore(this, { projectRef: selectedProject.ref }) this.meta = new MetaStore(this, { @@ -56,6 +58,7 @@ export class RootStore implements IRootStore { connectionString: selectedProject.connectionString ?? '', }) } else { + // @ts-ignore this.content = new ProjectContentStore(this, { projectRef: '' }) this.functions = new ProjectFunctionsStore(this, { projectRef: '' }) this.meta = new MetaStore(this, { diff --git a/studio/stores/content/ProjectContentStore.ts b/studio/stores/content/ProjectContentStore.ts index ac5d6ce31fc..05318375f6e 100644 --- a/studio/stores/content/ProjectContentStore.ts +++ b/studio/stores/content/ProjectContentStore.ts @@ -134,6 +134,7 @@ export default class ProjectContentStore implements IProjectContentStore { } } + // @ts-ignore async create(payload: any) { try { const headers = { diff --git a/studio/stores/functions/ProjectFunctionsStore.ts b/studio/stores/functions/ProjectFunctionsStore.ts index d33252aeb1e..d848c7ce111 100644 --- a/studio/stores/functions/ProjectFunctionsStore.ts +++ b/studio/stores/functions/ProjectFunctionsStore.ts @@ -32,6 +32,7 @@ export default class ProjectFunctionsStore implements IProjectFunctionsStore { } baseUrl: string + // @ts-ignore data: UserContentMap = [] state = this.STATES.INITIAL