}>
Sign In With Github
diff --git a/studio/components/interfaces/Home/ProjectUsage.tsx b/studio/components/interfaces/Home/ProjectUsage.tsx
index 02542221b4ee7..e8a0eeee07498 100644
--- a/studio/components/interfaces/Home/ProjectUsage.tsx
+++ b/studio/components/interfaces/Home/ProjectUsage.tsx
@@ -1,43 +1,83 @@
import useSWR from 'swr'
import dayjs from 'dayjs'
import Link from 'next/link'
-import { FC } from 'react'
+import { FC, useState } from 'react'
import { useRouter } from 'next/router'
-import { IconArchive, IconDatabase, IconKey, IconZap, Typography } from '@supabase/ui'
+import {
+ IconArchive,
+ IconDatabase,
+ IconKey,
+ IconZap,
+ Typography,
+ Button,
+ Dropdown,
+ IconChevronDown,
+} 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 { useIsActive } from 'hooks'
import { get } from 'lib/common/fetch'
import { API_URL, METRICS, DATE_FORMAT } from 'lib/constants'
+import { useFlag } from 'hooks'
-const DATETIME_FORMAT = 'MMM D, ha'
-
+const CHART_INTERVALS = [
+ { key: 'minutely', label: '60 minutes', startValue: 1, startUnit: 'hour', format: 'MMM D, h:ma' },
+ { key: 'hourly', label: '24 hours', startValue: 24, startUnit: 'hour', format: 'MMM D, ha' },
+ { key: 'daily', label: '7 days', startValue: 7, startUnit: 'day', format: 'MMM D' },
+]
interface Props {
project: any
}
const ProjectUsage: FC
= ({ project }) => {
+ const logsUsageChartIntervals = useFlag('logsUsageChartIntervals')
+ const [interval, setInterval] = useState('minutely')
const router = useRouter()
const { ref } = router.query
- const isActive = useIsActive()
const { data, error }: any = useSWR(
// only fetch when browser window is active
- `${API_URL}/projects/${ref}/log-stats`,
+ `${API_URL}/projects/${ref}/log-stats?interval=${interval}`,
get
// increase refresh rate x10 to 30s when focus lost
// conditional fetching will cause cached data to clear (not desirable)
// { refreshInterval: isActive ? 3000 : 30000 }
)
- const startDate = dayjs().subtract(7, 'day').format(DATE_FORMAT)
+ const selectedInterval = logsUsageChartIntervals
+ ? CHART_INTERVALS.find((i) => i.key === interval) || CHART_INTERVALS[0]
+ : CHART_INTERVALS[2]
+ const startDate = dayjs()
+ .subtract(selectedInterval.startValue, selectedInterval.startUnit)
+ .format(DATE_FORMAT)
const endDate = dayjs().format(DATE_FORMAT)
const charts = data?.data
-
+ const datetimeFormat = selectedInterval.format || 'MMM D, ha'
return (
-
Statistics for past 24 hours
+
+ Statistics for past {selectedInterval.label}
+
+ {logsUsageChartIntervals && (
+
+ {CHART_INTERVALS.map((i) => (
+
+ {i.label}
+
+ ))}
+
+ }
+ >
+
+ )}
+
{startDate && endDate && (
@@ -56,7 +96,7 @@ const ProjectUsage: FC
= ({ project }) => {
provider="log-stats"
interval="1d"
hideChartType
- customDateFormat={DATETIME_FORMAT}
+ customDateFormat={datetimeFormat}
data={charts}
isLoading={!charts && !error ? true : false}
/>
@@ -82,7 +122,7 @@ const ProjectUsage: FC = ({ project }) => {
provider="log-stats"
interval="1d"
hideChartType
- customDateFormat={DATETIME_FORMAT}
+ customDateFormat={datetimeFormat}
data={charts}
isLoading={!charts && !error ? true : false}
/>
@@ -108,7 +148,7 @@ const ProjectUsage: FC = ({ project }) => {
provider="log-stats"
interval="1d"
hideChartType
- customDateFormat={DATETIME_FORMAT}
+ customDateFormat={datetimeFormat}
data={charts}
isLoading={!charts && !error ? true : false}
/>
@@ -130,7 +170,7 @@ const ProjectUsage: FC = ({ project }) => {
provider="log-stats"
interval="1h"
hideChartType
- customDateFormat={DATETIME_FORMAT}
+ customDateFormat={datetimeFormat}
data={charts}
isLoading={!charts && !error ? true : false}
/>
diff --git a/studio/components/interfaces/Settings/Logs/LogPanel.tsx b/studio/components/interfaces/Settings/Logs/LogPanel.tsx
index ed80630b45e58..368f8ff793841 100644
--- a/studio/components/interfaces/Settings/Logs/LogPanel.tsx
+++ b/studio/components/interfaces/Settings/Logs/LogPanel.tsx
@@ -100,42 +100,44 @@ const LogPanel: FC = ({
{/* wrap with form so that if user presses enter, the search value will submit automatically */}
-
+ title="Go"
+ type="secondary"
+ onClick={() => onSearch(search)}
+ >
+ Go
+ ,
+ ]}
+ />
+
+ )}
= () => {
+ const router = useRouter()
+ const projectRef = router.query.ref
+ const supportUrl = `/support/new${projectRef ? `?ref=${projectRef}` : ''}`
+
return (
= () => {
hosted services.
- = () => {
}
React.useEffect(() => {
- // check server status every 1s
- checkServerInterval.current = window.setInterval(checkServer, 1000)
+ // check server status every 2s
+ checkServerInterval.current = window.setInterval(checkServer, 2000)
return () => {
clearInterval(checkServerInterval.current)
}
diff --git a/studio/components/to-be-cleaned/Integration/Vercel.utils.ts b/studio/components/to-be-cleaned/Integration/Vercel.utils.ts
index 382e8b1317680..ede2f67413b70 100644
--- a/studio/components/to-be-cleaned/Integration/Vercel.utils.ts
+++ b/studio/components/to-be-cleaned/Integration/Vercel.utils.ts
@@ -16,7 +16,7 @@ export async function fetchVercelProjects({
url = `${url}?${query}`
}
const response = await get(url, {
- headers: { Authorization: `Bearer ${vercelToken}` },
+ headers: { vercel_authorization: `Bearer ${vercelToken}` },
})
if (response.error != null) {
return { error: `Retrieve vercel projects failed. ${response.error?.message}` }
@@ -48,7 +48,7 @@ export async function fetchVercelProject({
url = `${url}?${query}`
}
const data = await get(url, {
- headers: { Authorization: `Bearer ${vercelToken}` },
+ headers: { vercel_authorization: `Bearer ${vercelToken}` },
})
if (data.error != null) {
return { error: `Retrieve vercel project failed. ${data.error.message}` }
@@ -74,7 +74,7 @@ export async function fetchVercelProjectEnvs({
url = `${url}?${query}`
}
const response = await get(url, {
- headers: { Authorization: `Bearer ${vercelToken}` },
+ headers: { vercel_authorization: `Bearer ${vercelToken}` },
})
if (response.error != null) {
return { error: `Retrieve vercel project envs failed. ${response.error?.message}` }
@@ -114,7 +114,7 @@ export async function createVercelEnv({
url,
{ key, value, type, target },
{
- headers: { Authorization: `Bearer ${vercelToken}` },
+ headers: { vercel_authorization: `Bearer ${vercelToken}` },
}
)
}
diff --git a/studio/components/to-be-cleaned/ModalsDeprecated/InviteMemberModal.js b/studio/components/to-be-cleaned/ModalsDeprecated/InviteMemberModal.js
index d7a763b07ea78..3658d22600211 100644
--- a/studio/components/to-be-cleaned/ModalsDeprecated/InviteMemberModal.js
+++ b/studio/components/to-be-cleaned/ModalsDeprecated/InviteMemberModal.js
@@ -1,5 +1,5 @@
import { createContext, useContext, useCallback, useState, useEffect } from 'react'
-import { debounce, isUndefined } from 'lodash'
+import { debounce, isNil } from 'lodash'
import { observer, useLocalObservable } from 'mobx-react-lite'
import { post } from 'lib/common/fetch'
import { Button, IconKey, IconLoader, IconUser, IconX, Input, Typography } from '@supabase/ui'
@@ -70,7 +70,7 @@ function InviteMemberModal({ organization, members = [] }) {
org_id: orgId,
user_id: PageState.selectedProfile.id,
})
- if (isUndefined(response)) {
+ if (isNil(response)) {
ui.setNotification({ category: 'error', message: 'Failed to add member' })
} else if (response?.error) {
ui.setNotification({
@@ -141,7 +141,7 @@ const InputSearchWithResults = observer(({ className }) => {
}
setLoading(true)
const response = await post(`${API_URL}/profile/search`, { keywords: PageState.keywords })
- if (isUndefined(response)) {
+ if (isNil(response)) {
ui.setNotification({ category: 'error', message: 'Failed to search profile' })
} else if (response.error) {
ui.setNotification({
diff --git a/studio/components/to-be-cleaned/SqlEditor/TabSqlQuery.js b/studio/components/to-be-cleaned/SqlEditor/TabSqlQuery.js
index c95f034420089..927179bfb1a5a 100644
--- a/studio/components/to-be-cleaned/SqlEditor/TabSqlQuery.js
+++ b/studio/components/to-be-cleaned/SqlEditor/TabSqlQuery.js
@@ -567,7 +567,7 @@ const Results = ({ results }) => {
}
function onCopyCell() {
- if (cellPosition) {
+ if (columns && cellPosition) {
const { idx, rowIdx } = cellPosition
const colKey = columns[idx].key
const cellValue = results[rowIdx]?.[colKey] ?? ''
diff --git a/studio/hooks/misc/withAuth.tsx b/studio/hooks/misc/withAuth.tsx
index 89b0ff9712ad4..680c4c34cb1a3 100644
--- a/studio/hooks/misc/withAuth.tsx
+++ b/studio/hooks/misc/withAuth.tsx
@@ -24,7 +24,7 @@ export function withAuth(
const { app, ui } = rootStore
const page = router.pathname.split('/')[3]
- const redirectTo = options?.redirectTo ?? (!isUndefined(ref) ? `/project/${ref}` : '/')
+ const redirectTo = options?.redirectTo ?? defaultRedirectTo(ref)
const redirectIfFound = options?.redirectIfFound
const returning =
@@ -75,6 +75,10 @@ export function withAuth(
}
}
+function defaultRedirectTo(ref: string | string[] | undefined) {
+ return IS_PLATFORM ? '/' : !isUndefined(ref) ? `/project/${ref}` : '/'
+}
+
function checkRedirectTo(
loading: boolean,
router: NextRouter,
@@ -83,7 +87,7 @@ function checkRedirectTo(
redirectIfFound?: boolean
) {
if (loading) return false
- if (router.asPath == redirectTo) return false
+ if (router.pathname == redirectTo) return false
// If redirectTo is set, redirect if the user was not found.
if (redirectTo && !redirectIfFound && !profile) return true
diff --git a/studio/jest.config.js b/studio/jest.config.js
index b36d3b52c99c5..b07758343ba23 100644
--- a/studio/jest.config.js
+++ b/studio/jest.config.js
@@ -1,7 +1,7 @@
module.exports = {
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
moduleDirectories: ['', 'node_modules'],
- setupFiles: ["jest-canvas-mock"],
+ setupFiles: ["jest-canvas-mock", "./tests/setup/radix"],
testEnvironment: 'jsdom',
testRegex: '(.*\\.test.(js|jsx|ts|tsx)$)',
transform: { '^.+\\.(t|j)sx?$': 'ts-jest' },
diff --git a/studio/lib/constants/infrastructure.ts b/studio/lib/constants/infrastructure.ts
index 5c138eb240abd..b33ebb4ba65d3 100644
--- a/studio/lib/constants/infrastructure.ts
+++ b/studio/lib/constants/infrastructure.ts
@@ -26,7 +26,7 @@ export const PRICING_PLANS = {
// PAYG: 'Pay as you go',
}
-export const PRICING_PLANS_DEFAULT = PRICING_PLANS.PRO
+export const PRICING_PLANS_DEFAULT = PRICING_PLANS.FREE
export const PROVIDERS = {
AWS: {
diff --git a/studio/lib/gotrue.ts b/studio/lib/gotrue.ts
index cbdfdf1772b60..5a711db5152c6 100644
--- a/studio/lib/gotrue.ts
+++ b/studio/lib/gotrue.ts
@@ -1,6 +1,6 @@
import { GoTrueClient, User } from '@supabase/gotrue-js'
-export const GOTRUE_URL = process.env.NEXT_PUBLIC_GOTRUE_URL || 'http://localhost:8000/auth/v1'
+export const GOTRUE_URL = process.env.NEXT_PUBLIC_GOTRUE_URL || `${process.env.SUPABASE_URL}/auth/v1`
export const auth = new GoTrueClient({
url: GOTRUE_URL,
diff --git a/studio/package.json b/studio/package.json
index a8bf92423e702..346df5c4d2ade 100644
--- a/studio/package.json
+++ b/studio/package.json
@@ -17,7 +17,7 @@
"@radix-ui/react-tooltip": "^0.1.6",
"@sentry/browser": "^6.15.0",
"@sentry/nextjs": "^6.15.0",
- "@supabase/grid": "^2.3.9",
+ "@supabase/grid": "^2.4.0",
"@supabase/postgres-meta": "^0.26.1",
"@supabase/react-data-grid": "^7.1.0-beta.7",
"@supabase/supabase-js": "^1.29.1",
diff --git a/studio/pages/_app.tsx b/studio/pages/_app.tsx
index 9b73864c7b5c0..bd8b42a766f80 100644
--- a/studio/pages/_app.tsx
+++ b/studio/pages/_app.tsx
@@ -9,120 +9,17 @@ import 'styles/monaco.scss'
import 'styles/contextMenu.scss'
import Head from 'next/head'
-import dynamic from 'next/dynamic'
import type { AppProps } from 'next/app'
import { useRouter } from 'next/router'
-import { FC, useEffect, useState } from 'react'
-import { Subscription } from '@supabase/gotrue-js'
-import { Toaster, ToastBar, toast } from 'react-hot-toast'
-import { Button, IconX } from '@supabase/ui'
+import { useEffect, useState } from 'react'
import { RootStore } from 'stores'
import { StoreProvider } from 'hooks'
import { getParameterByName } from 'lib/common/fetch'
import { GOTRUE_ERRORS } from 'lib/constants'
-import { auth } from 'lib/gotrue'
+
+import { PortalToast, GoTrueWrapper, RouteValidationWrapper } from 'components/interfaces/App'
import PageTelemetry from 'components/ui/PageTelemetry'
import FlagProvider from 'components/ui/Flag/FlagProvider'
-import Connecting from 'components/ui/Loading'
-
-const PortalRootWithNoSSR = dynamic(
- // @ts-ignore
- () => import('@radix-ui/react-portal').then((portal) => portal.Root),
- { ssr: false }
-)
-
-const PortalToast = () => (
- // @ts-ignore
-
-
- {(t) => (
-
- {({ icon, message }) => (
- <>
- {icon}
- {message}
- {t.type !== 'loading' && (
-
- toast.dismiss(t.id)}>
-
-
- )}
-
- )}
-
- )}
-
-
-)
-
-function doesTokenDataExist() {
- // ignore if server-side
- if (typeof window === 'undefined') return false
- // check tokenData on localstorage
- const tokenData = window?.localStorage['supabase.auth.token']
- return tokenData != undefined && typeof tokenData === 'string'
-}
-
-/**
- * On app first load, gotrue client may take a while to refresh access token
- * We have to wait for that process to complete before showing children components
- */
-const GotrueWrapper: FC = ({ children }) => {
- const [loading, setLoading] = useState(doesTokenDataExist())
-
- useEffect(() => {
- let subscription: Subscription | null
- let timer: any
- const currentSession = auth.session()
-
- function tokenRefreshed() {
- setLoading(false)
- // clean subscription
- if (subscription) subscription.unsubscribe()
- // clean timer
- if (timer) clearTimeout(timer)
- }
-
- if (currentSession != undefined && currentSession != null) {
- // if there is an active session, go ahead
- setLoading(false)
- } else {
- // else wait for TOKEN_REFRESHED event before continue
- const response = auth.onAuthStateChange((_event, session) => {
- if (loading && _event === 'TOKEN_REFRESHED') {
- tokenRefreshed()
- }
- })
- subscription = response.data ?? null
-
- // we need a timeout here, in case token refresh fails
- timer = setTimeout(() => setLoading(false), 5 * 1000)
- }
-
- return () => {
- if (subscription) subscription.unsubscribe()
- if (timer) clearTimeout(timer)
- }
- }, [])
-
- return <>{loading ?
+
-
+
-
+
+
{/* @ts-ignore */}
{
)
})
+const GithubProfile = observer(() => {
+ const { ui } = useStore()
+
+ return (
+
+ Account Information
+ ,
+ ]}
+ >
+
+
+
+
+
+ )
+})
+
const ThemeSettings = observer(() => {
const { ui } = useStore()
@@ -89,7 +129,7 @@ const ThemeSettings = observer(() => {
]}
>
- {
System default
- Dark
- Light
-
+ System default
+ Dark
+ Light
+
)
diff --git a/studio/pages/api/auth/[ref]/users.ts b/studio/pages/api/auth/[ref]/users.ts
index c97de828cfbce..5839d8bb135a3 100644
--- a/studio/pages/api/auth/[ref]/users.ts
+++ b/studio/pages/api/auth/[ref]/users.ts
@@ -68,6 +68,6 @@ const handleDelete = async (req: NextApiRequest, res: NextApiResponse) => {
const payload = req.body
const query = { query: `DELETE from auth.users where id='${payload.id}';` }
- const response = post(`${PG_META_URL}/query`, { query }, { headers })
+ const response = post(`${PG_META_URL}/query`, query, { headers })
return res.status(200).json(response)
}
diff --git a/studio/pages/api/props/project/[ref]/api.ts b/studio/pages/api/props/project/[ref]/api.ts
index efc2e2efacfed..a348d5ba07924 100644
--- a/studio/pages/api/props/project/[ref]/api.ts
+++ b/studio/pages/api/props/project/[ref]/api.ts
@@ -38,11 +38,11 @@ const handleGetAll = async (req: NextApiRequest, res: NextApiResponse) => {
app: { id: 1, name: 'Auto API' },
app_config: {
db_schema: 'public',
- endpoint: 'localhost:8000',
+ endpoint: process.env.SUPABASE_URL,
realtime_enabled: true,
},
- endpoint: 'http://localhost:8000',
- restUrl: 'http://localhost:8000/rest/v1/',
+ endpoint: process.env.SUPABASE_URL || 'http://localhost:8000',
+ restUrl: process.env.SUPABASE_REST_URL || 'http://localhost:8000/rest/v1/',
defaultApiKey: process.env.SUPABASE_ANON_KEY,
serviceApiKey: process.env.SUPABASE_SERVICE_KEY,
internalApiKey: process.env.SUPABASE_ANON_KEY,
@@ -68,11 +68,11 @@ const handleGetAll = async (req: NextApiRequest, res: NextApiResponse) => {
app: { id: 1, name: 'Auto API' },
app_config: {
db_schema: 'public',
- endpoint: 'localhost:8000',
+ endpoint: process.env.SUPABASE_URL,
realtime_enabled: true,
},
- endpoint: 'http://localhost:8000',
- restUrl: 'http://localhost:8000/rest/v1/',
+ endpoint: process.env.SUPABASE_URL,
+ restUrl: `${process.env.SUPABASE_URL}/rest/v1/`,
defaultApiKey: process.env.SUPABASE_ANON_KEY,
serviceApiKey: process.env.SUPABASE_SERVICE_KEY,
internalApiKey: process.env.SUPABASE_ANON_KEY,
diff --git a/studio/pages/api/props/project/[ref]/settings.ts b/studio/pages/api/props/project/[ref]/settings.ts
index 40a18f06462d6..a5ed9be25e928 100644
--- a/studio/pages/api/props/project/[ref]/settings.ts
+++ b/studio/pages/api/props/project/[ref]/settings.ts
@@ -55,7 +55,7 @@ const handleGetAll = async (req: NextApiRequest, res: NextApiResponse) => {
app: { id: 1, name: 'Auto API' },
app_config: {
db_schema: 'public',
- endpoint: 'localhost:8000',
+ endpoint: process.env.SUPABASE_URL,
realtime_enabled: true,
},
},
diff --git a/studio/pages/index.tsx b/studio/pages/index.tsx
index 2611ff1f69beb..5fd19797cc7f6 100644
--- a/studio/pages/index.tsx
+++ b/studio/pages/index.tsx
@@ -1,19 +1,21 @@
import { NextPage } from 'next'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
import { observer } from 'mobx-react-lite'
-import { useRouter } from 'next/router'
+import { NextRouter, useRouter } from 'next/router'
import { isUndefined } from 'lodash'
import { Typography } from '@supabase/ui'
import { Project } from 'types'
import { useProfile, useStore, withAuth } from 'hooks'
import { post, delete_ } from 'lib/common/fetch'
-import { API_URL, IS_PLATFORM, PROJECT_STATUS, STRIPE_PRODUCT_IDS } from 'lib/constants'
+import { API_URL, IS_PLATFORM, PROJECT_STATUS } from 'lib/constants'
import { AccountLayout } from 'components/layouts'
+import { auth } from 'lib/gotrue'
import Landing from 'components/interfaces/Home/Landing'
import ProjectList from 'components/interfaces/Home/ProjectList'
import OrganizationDropdown from 'components/to-be-cleaned/Dropdown/OrganizationDropdown'
import TextConfirmModal from 'components/to-be-cleaned/ModalsDeprecated/TextConfirmModal'
+import Connecting from 'components/ui/Loading'
const Home: NextPage = () => {
const { app, ui } = useStore()
@@ -26,7 +28,23 @@ const Home: NextPage = () => {
const [selectedProjectToDelete, setSelectedProjectToDelete] = useState()
if (!profile) {
- return
- Only the organization owner can create new projects. Contact your organizaton owner to
+ Only the organization owner can create new projects. Contact your organization owner to
create a new project for this organization.
diff --git a/studio/pages/new/index.tsx b/studio/pages/new/index.tsx
index e095e1b16484a..8d2cf5477e129 100644
--- a/studio/pages/new/index.tsx
+++ b/studio/pages/new/index.tsx
@@ -1,7 +1,7 @@
import { useState } from 'react'
import { observer } from 'mobx-react-lite'
import { Button, Typography } from '@supabase/ui'
-import Router from 'next/router'
+import { useRouter } from 'next/router'
import { API_URL } from 'lib/constants'
import { useStore, withAuth } from 'hooks'
@@ -15,6 +15,8 @@ import Panel from 'components/to-be-cleaned/Panel'
*/
const Wizard = () => {
const { ui, app } = useStore()
+ const router = useRouter()
+
const [orgName, setOrgName] = useState('')
const [newOrgLoading, setNewOrgLoading] = useState(false)
@@ -49,11 +51,7 @@ const Wizard = () => {
} else {
const org = response
app.onOrgAdded(org)
-
- // Router.push('/new/[slug]', `/new/${org.slug}`)
- // Using window.location.href for now as organization metadata needs to refresh
- // We do not get is_owner nor stripe_customer_id from the response here
- window.location.href = `/new/${org.slug}`
+ router.push(`/new/${org.slug}`)
}
}
@@ -70,7 +68,7 @@ const Wizard = () => {
]}
footer={[
-
Router.push('/')}>
+ router.push('/')}>
Cancel
diff --git a/studio/pages/org/[slug]/settings.tsx b/studio/pages/org/[slug]/settings.tsx
index 24a4a5875298d..d32d70cff71c5 100644
--- a/studio/pages/org/[slug]/settings.tsx
+++ b/studio/pages/org/[slug]/settings.tsx
@@ -96,7 +96,7 @@ const PageLayout = observer(() => {
return (
{
}
}, [members, products, isOrgDetailError])
+ if (!PageState.organization) return
+
return (
@@ -142,7 +144,7 @@ const TabsView = observer(() => {
- {PageState.organization.name || 'Organization'} settings
+ {PageState.organization?.name || 'Organization'} settings
diff --git a/studio/pages/project/[ref]/settings/database.tsx b/studio/pages/project/[ref]/settings/database.tsx
index fc8f8a0d39b18..009761a2ab15a 100644
--- a/studio/pages/project/[ref]/settings/database.tsx
+++ b/studio/pages/project/[ref]/settings/database.tsx
@@ -188,6 +188,7 @@ const ResetDbPassword: FC = () => {
} else {
ui.setNotification({ category: 'error', message: 'Failed to reset password' })
}
+ setIsUpdatingPassword(false)
}
}
@@ -279,9 +280,6 @@ const DownloadCertificate: FC = ({ createdAt }) => {
}
const GeneralSettings: FC = ({ projectRef }) => {
- const { ui } = useStore()
- const isOwner = ui.selectedOrganization?.is_owner
-
const { data, error }: any = useSWR(`${API_URL}/props/project/${projectRef}/settings`, get)
if (data?.error || error) {
@@ -378,7 +376,7 @@ const GeneralSettings: FC = ({ projectRef }) => {
- {isOwner &&
diff --git a/studio/pages/project/[ref]/settings/logs/[type].tsx b/studio/pages/project/[ref]/settings/logs/[type].tsx
index 295e18d782bfa..6fbe0dba3d86e 100644
--- a/studio/pages/project/[ref]/settings/logs/[type].tsx
+++ b/studio/pages/project/[ref]/settings/logs/[type].tsx
@@ -180,6 +180,7 @@ export const LogPage: NextPage = () => {
...prev,
where: isSelectQuery ? '' : editorValue,
sql: isSelectQuery ? editorValue : '',
+ search_query: ''
}))
if (!logsQueryParamsSyncing) return
router.push({
@@ -192,7 +193,7 @@ export const LogPage: NextPage = () => {
})
}
const handleSearch = (v: string) => {
- setParams((prev) => ({ ...prev, search_query: v || '' }))
+ setParams((prev) => ({ ...prev, search_query: v || '', where: '', sql: '' }))
if (!logsQueryParamsSyncing) return
router.push({
pathname: router.pathname,
@@ -202,6 +203,7 @@ export const LogPage: NextPage = () => {
s: v || '',
},
})
+ setEditorValue('')
}
return (
diff --git a/studio/pages/support/new.tsx b/studio/pages/support/new.tsx
index 811c2dacbe35e..1b7ebfc0278fc 100644
--- a/studio/pages/support/new.tsx
+++ b/studio/pages/support/new.tsx
@@ -12,11 +12,13 @@ import {
} from '@supabase/ui'
import SVG from 'react-inlinesvg'
import Link from 'next/link'
+import { useRouter } from 'next/router'
import { API_URL } from 'lib/constants'
import { useStore, withAuth } from 'hooks'
import { post } from 'lib/common/fetch'
import { Project } from 'types'
+import { isUndefined } from 'lodash'
const DEFAULT = {
category: {
@@ -49,6 +51,9 @@ function formReducer(state: any, action: any) {
const SupportNew = () => {
const { ui, app } = useStore()
+ const router = useRouter()
+ const projectRef = router.query.ref
+
const [formState, formDispatch] = useReducer(formReducer, DEFAULT)
const [errors, setErrors] = useState
([])
const [loading, setLoading] = useState(false)
@@ -72,7 +77,12 @@ const SupportNew = () => {
useEffect(() => {
// set project default
if (sortedProjects.length > 1) {
- handleOnChange({ name: 'project', value: sortedProjects[0].ref })
+ const selectedProject = sortedProjects.find((project: Project) => project.ref === projectRef)
+ if (!isUndefined(selectedProject)) {
+ handleOnChange({ name: 'project', value: selectedProject.ref })
+ } else {
+ handleOnChange({ name: 'project', value: sortedProjects[0].ref })
+ }
} else {
// set as 'No specific project'
handleOnChange({ name: 'project', value: projectDefaults[0].ref })
diff --git a/studio/pages/vercel/integrate.tsx b/studio/pages/vercel/integrate.tsx
index 89c244c140b3d..4859b8d02dff8 100644
--- a/studio/pages/vercel/integrate.tsx
+++ b/studio/pages/vercel/integrate.tsx
@@ -226,7 +226,7 @@ const Connecting = () => (
const ProjectLinksEmptyState = () => (
- You haven’t created a Supabase project yet. Get started by creating a new Supabase project,
+ You haven't created a Supabase project yet. Get started by creating a new Supabase project,
then close this window and retry adding integration.
diff --git a/studio/pages/vercel/setupProject.tsx b/studio/pages/vercel/setupProject.tsx
index 867e48b269c54..7c4ae8ef07357 100644
--- a/studio/pages/vercel/setupProject.tsx
+++ b/studio/pages/vercel/setupProject.tsx
@@ -200,7 +200,7 @@ const CreateProject = observer(() => {
async function createSupabaseProject(dbSql: string) {
const data = {
cloud_provider: PROVIDERS.AWS.id, // hardcoded for DB instances to be under AWS
- org_id: _store.supabaseOrgId,
+ org_id: Number(_store.supabaseOrgId),
name: projectName,
db_pass: dbPass,
db_region: dbRegion,
diff --git a/studio/public/favicon.ico b/studio/public/favicon.ico
index d3fca2acb10d8..5c4d1dcc5cf13 100644
Binary files a/studio/public/favicon.ico and b/studio/public/favicon.ico differ
diff --git a/studio/stores/app/AppStore.ts b/studio/stores/app/AppStore.ts
index b50a0bebfd0f0..4ce562ef5b86b 100644
--- a/studio/stores/app/AppStore.ts
+++ b/studio/stores/app/AppStore.ts
@@ -1,6 +1,6 @@
import { cloneDeep } from 'lodash'
import { values } from 'mobx'
-import { Project } from 'types'
+import { Organization, Project } from 'types'
import { API_URL, STRIPE_PRODUCT_IDS } from 'lib/constants'
import { IRootStore } from '../RootStore'
@@ -71,19 +71,23 @@ export default class AppStore implements IAppStore {
}
}
- onOrgUpdated(org: any) {
- if (org && org.id) {
- this.organizations.data[org.id] = { ...org }
+ onOrgUpdated(updatedOrg: Organization) {
+ if (updatedOrg && updatedOrg.id) {
+ const originalOrg = this.organizations.data[updatedOrg.id]
+ this.organizations.data[updatedOrg.id] = {
+ ...originalOrg,
+ ...updatedOrg,
+ }
}
}
- onOrgAdded(org: any) {
+ onOrgAdded(org: Organization) {
if (org && org.id) {
- this.organizations.data[org.id] = { ...org }
+ this.organizations.data[org.id] = org
}
}
- onOrgDeleted(org: any) {
+ onOrgDeleted(org: Organization) {
if (org && org.id) {
const projects = values(this.projects.data)
// cleanup projects saved queries
diff --git a/studio/tests/components/Home/ProjectUsage.test.js b/studio/tests/components/Home/ProjectUsage.test.js
new file mode 100644
index 0000000000000..9864a387cd1e1
--- /dev/null
+++ b/studio/tests/components/Home/ProjectUsage.test.js
@@ -0,0 +1,97 @@
+import { render, waitFor, screen } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
+jest.mock('lib/common/fetch')
+import { get } from 'lib/common/fetch'
+
+// mock the router
+jest.mock('next/router')
+import { useRouter } from 'next/router'
+import { clickDropdown } from 'tests/helpers'
+useRouter.mockReturnValue({ query: { ref: '123' } })
+
+// need to wrap component with SWRConfig in order to clear cache between tests
+// TODO: abstract out to global setup
+import { SWRConfig } from 'swr'
+const ProjectUsage = jest.fn()
+ProjectUsage.mockImplementation((props) => {
+ const Original = jest.requireActual('components/interfaces/Home/ProjectUsage').default
+ // wrap with SWR to reset the cache each time
+ return (
+ new Map() }}>
+
+ )
+})
+
+jest.mock('components/ui/Flag/Flag')
+import Flag from 'components/ui/Flag/Flag'
+Flag.mockImplementation(({ children }) => <>{children})
+jest.mock('hooks')
+import { useFlag } from 'hooks'
+useFlag.mockReturnValue(true)
+
+
+
+beforeEach(() => {
+ get.mockReset()
+})
+
+const MOCK_CHART_DATA = {
+ data: [
+ {
+ total_auth_requests: 123,
+ total_realtime_requests: 223,
+ total_storage_requests: 323,
+ total_rest_requests: 333,
+ timestamp: new Date().getTime() / 1000,
+ },
+ ],
+ total: 123 + 223 + 323,
+ totalAverage: 123 + 223 + 323,
+ totalGrouped: {
+ total_auth_requests: 123,
+ total_realtime_requests: 223,
+ total_storage_requests: 323,
+ total_rest_requests: 333,
+ },
+}
+
+test('mounts correctly', async () => {
+ get.mockImplementation((url) => {
+ if (url.includes('usage')) return {}
+ return { data: MOCK_CHART_DATA }
+ })
+ render(
diff --git a/www/components/Nav/index.tsx b/www/components/Nav/index.tsx
index 2b7984e661dcf..0c1e65f1a3da9 100644
--- a/www/components/Nav/index.tsx
+++ b/www/components/Nav/index.tsx
@@ -253,7 +253,7 @@ const Nav = (props: Props) => {
Sign in
-
+
Start your project
@@ -323,7 +323,7 @@ const Nav = (props: Props) => {
Developers
Company
diff --git a/www/data/Announcements.json b/www/data/Announcements.json
index 4145701af7561..77b9ce6ccbe0f 100644
--- a/www/data/Announcements.json
+++ b/www/data/Announcements.json
@@ -1,33 +1,33 @@
[
{
"type": "Announcement",
- "title": "Launch Week II: The SQL",
- "description": "We're launching a product every day for one week in July.",
- "imgUrl": "images/case-study-monitoro.jpg",
- "logoUrl": "images/logos/monitoro.png",
- "organization": "Monitoro",
- "url": "/blog/2021/07/22/supabase-launch-week-sql",
+ "title": "Supabase Launch Week III: Holiday Special",
+ "description": "Santa's little hackers have been hard at work because we've got another five days of launches ready to go.",
+ "imgUrl": "images/blog/launch-week-three/launch-week-three-og.jpg",
+ "logoUrl": "images/blog/launch-week-three/launch-week-three-og.jpg",
+ "organization": "Supabase",
+ "url": "/blog/2021/11/26/supabase-launch-week-the-trilogy",
"postMeta": {
"name": "Paul Copplestone",
"avatarUrl": "https://avatars0.githubusercontent.com/u/10214025?v=4",
- "publishDate": "Mar 16, 2020",
- "readLength": 6
+ "publishDate": "Nov 26, 2021",
+ "readLength": 2
},
"ctaText": "View case study"
},
{
"type": "Announcement",
- "title": "Supabase Storage",
- "description": "Supabase launches Storage leveraging Postgres.",
- "imgUrl": "images/case-study-monitoro.jpg",
- "logoUrl": "images/logos/monitoro.png",
- "organization": "Monitoro",
- "url": "/blog/2021/03/30/supabase-storage",
+ "title": "Supabase $30m Series A",
+ "description": "Supabase just raised $30M, bringing our total funding to $36M. How will we spend this? Read on to find out.",
+ "imgUrl": "images/blog/series-a/supabase-series-a.png",
+ "logoUrl": "images/blog/series-a/supabase-series-a.png",
+ "organization": "Supabase",
+ "url": "/blog/2021/10/28/supabase-series-a",
"postMeta": {
"name": "Paul Copplestone",
"avatarUrl": "https://avatars0.githubusercontent.com/u/10214025?v=4",
- "publishDate": "Mar 16, 2020",
- "readLength": 6
+ "publishDate": "Oct 28, 2021",
+ "readLength": 28
},
"ctaText": "View case study"
}
diff --git a/www/data/Community.tsx b/www/data/Community.tsx
index 0677b741eb575..952ed888365dc 100644
--- a/www/data/Community.tsx
+++ b/www/data/Community.tsx
@@ -31,7 +31,7 @@ const data: CommunityItem[] = [
},
{
title: 'GitHub',
- stat: '24,000+',
+ stat: '26,000+',
statLabel: 'Github stars',
img: 'github.png',
invertImgDarkMode: true,
@@ -43,7 +43,7 @@ const data: CommunityItem[] = [
},
{
title: 'Twitter',
- stat: '20,000+',
+ stat: '22,000+',
statLabel: 'Followers',
img: 'twitter.png',
detail: () => (
diff --git a/www/data/PricingFAQ.json b/www/data/PricingFAQ.json
index 88adacfa878f5..63ab052c5dfce 100644
--- a/www/data/PricingFAQ.json
+++ b/www/data/PricingFAQ.json
@@ -5,7 +5,7 @@
},
{
"question": "Is there a cap on the number of projects for the Free Tier?",
- "answer": "Yes, on the Free Tier you can have a maximum of two organizations, each with up to two projects. This means that you can have a maximum of four free projects in your account."
+ "answer": "Yes, you have can up to 2 free projects in your account across all organizations that you own. You also are able to create as many organizations as you want."
},
{
"question": "When will I be billed?",
diff --git a/www/public/images/blog/launch-week-3/launch-week-3-og.jpg b/www/public/images/blog/launch-week-3/launch-week-3-og.jpg
new file mode 100644
index 0000000000000..dcaece66ea8b3
Binary files /dev/null and b/www/public/images/blog/launch-week-3/launch-week-3-og.jpg differ
diff --git a/www/public/images/blog/launch-week-3/launch-week-3-thumb.jpg b/www/public/images/blog/launch-week-3/launch-week-3-thumb.jpg
new file mode 100644
index 0000000000000..dcaece66ea8b3
Binary files /dev/null and b/www/public/images/blog/launch-week-3/launch-week-3-thumb.jpg differ