diff --git a/apps/studio/components/interfaces/Auth/Policies/PolicyTemplates/TemplatesList.tsx b/apps/studio/components/interfaces/Auth/Policies/PolicyTemplates/TemplatesList.tsx index f1e2d9e0d18..66b440b18fe 100644 --- a/apps/studio/components/interfaces/Auth/Policies/PolicyTemplates/TemplatesList.tsx +++ b/apps/studio/components/interfaces/Auth/Policies/PolicyTemplates/TemplatesList.tsx @@ -23,7 +23,7 @@ const TemplatesList = ({ > {templates.map((template, i) => { - const active = selectedTemplate === template + const active = selectedTemplate?.id === template?.id return (
void + templates?: PolicyTemplate[] + templatesNote?: string + onUseTemplate?: (template: PolicyTemplate) => void } const PolicyTemplates = ({ @@ -17,7 +17,7 @@ const PolicyTemplates = ({ templatesNote = '', onUseTemplate = noop, }: PolicyTemplatesProps) => { - const [selectedTemplate, setSelectedTemplate] = useState(templates[0]) + const [selectedTemplate, setSelectedTemplate] = useState(templates[0]) return (
diff --git a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.js b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.tsx similarity index 91% rename from apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.js rename to apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.tsx index ee649b27dc1..b2230725e11 100644 --- a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.js +++ b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.tsx @@ -25,12 +25,12 @@ const StoragePolicies = () => { const { data } = useBucketsQuery({ projectRef }) const buckets = data ?? [] - const roles = meta.roles.list((role) => !meta.roles.systemRoles.includes(role.name)) + const roles = meta.roles.list((role: any) => !meta.roles.systemRoles.includes(role.name)) - const [policies, setPolicies] = useState([]) + const [policies, setPolicies] = useState([]) const [selectedPolicyToEdit, setSelectedPolicyToEdit] = useState({}) - const [selectedPolicyToDelete, setSelectedPolicyToDelete] = useState({}) - const [isEditingPolicyForBucket, setIsEditingPolicyForBucket] = useState({}) + const [selectedPolicyToDelete, setSelectedPolicyToDelete] = useState({}) + const [isEditingPolicyForBucket, setIsEditingPolicyForBucket] = useState({}) // Only use storage policy editor when creating new policies for buckets const showStoragePolicyEditor = @@ -60,9 +60,7 @@ const StoragePolicies = () => { if (meta) { await meta.policies.load() const storagePolicies = - meta?.policies.list((policy) => policy.schema === 'storage', { - allSchemas: true, - }) ?? [] + meta?.policies.list((policy: any) => policy.schema === 'storage') ?? [] setPolicies(storagePolicies) } } @@ -72,7 +70,7 @@ const StoragePolicies = () => { setIsEditingPolicyForBucket({ bucket: bucketName, table }) } - const onSelectPolicyEdit = (policy, bucketName = '', table = '') => { + const onSelectPolicyEdit = (policy: any, bucketName = '', table = '') => { setIsEditingPolicyForBucket({ bucket: bucketName, table }) setSelectedPolicyToEdit(policy) } @@ -81,7 +79,7 @@ const StoragePolicies = () => { setIsEditingPolicyForBucket({}) } - const onSelectPolicyDelete = (policy) => setSelectedPolicyToDelete(policy) + const onSelectPolicyDelete = (policy: any) => setSelectedPolicyToDelete(policy) const onCancelPolicyDelete = () => setSelectedPolicyToDelete({}) const onSavePolicySuccess = async () => { @@ -94,7 +92,7 @@ const StoragePolicies = () => { Functions that involve the CRUD for policies For each API call within the Promise.all, return true if an error occurred, else return false */ - const onCreatePolicies = async (payloads) => { + const onCreatePolicies = async (payloads: any[]) => { return await Promise.all( payloads.map(async (payload) => { const res = await meta.policies.create(payload) @@ -110,7 +108,7 @@ const StoragePolicies = () => { ) } - const onCreatePolicy = async (payload) => { + const onCreatePolicy = async (payload: any) => { const res = await meta.policies.create(payload) if (res.error) { ui.setNotification({ @@ -122,7 +120,7 @@ const StoragePolicies = () => { return false } - const onUpdatePolicy = async (payload) => { + const onUpdatePolicy = async (payload: any) => { const res = await meta.policies.update(payload.id, payload) if (res.error) { ui.setNotification({ @@ -135,8 +133,8 @@ const StoragePolicies = () => { } const onDeletePolicy = async () => { - const res = await meta.policies.del(selectedPolicyToDelete.id) - if (res.error) { + const res: any = await meta.policies.del(selectedPolicyToDelete.id) + if (res) { ui.setNotification({ category: 'error', message: `Failed to delete policy: ${res.error.message}`, @@ -229,7 +227,6 @@ const StoragePolicies = () => { schema="storage" roles={roles} table={isEditingPolicyForBucket.table} - target={isEditingPolicyForBucket.bucket} selectedPolicyToEdit={selectedPolicyToEdit} onSelectCancel={onCancelPolicyEdit} onCreatePolicy={onCreatePolicy} diff --git a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.js b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.tsx similarity index 89% rename from apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.js rename to apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.tsx index ded7a42767f..d5e5a96c2be 100644 --- a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.js +++ b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesBucketRow.tsx @@ -14,13 +14,21 @@ import { IconTrash, } from 'ui' +interface PolicyRowProps { + policy: any + table: any + bucketName: string + onSelectPolicyEdit: (p: any, s: string, t: any) => void + onSelectPolicyDelete: (s: string) => void +} + const PolicyRow = ({ policy, table, bucketName, onSelectPolicyEdit = () => {}, onSelectPolicyDelete = () => {}, -}) => { +}: PolicyRowProps) => { const { name, command } = policy return (
@@ -39,21 +47,16 @@ const PolicyRow = ({ icon={} /> - + onSelectPolicyEdit(policy, bucketName, table)} >

Edit

 - onSelectPolicyDelete(policy)} - > + onSelectPolicyDelete(policy)}>

Delete

 @@ -72,7 +75,7 @@ const StoragePoliciesBucketRow = ({ onSelectPolicyAdd = () => {}, onSelectPolicyEdit = () => {}, onSelectPolicyDelete = () => {}, -}) => { +}: any) => { const getFooterLabel = () => { if (isEmpty(bucket)) return table === 'objects' @@ -106,7 +109,7 @@ const StoragePoliciesBucketRow = ({
) : (
- {policies.map((policy) => ( + {policies.map((policy: any) => ( {}, onCreatePolicies = () => {}, onSaveSuccess = () => {}, -}) => { +}: any) => { const { ui } = useStore() const [previousView, setPreviousView] = useState('') // Mainly to decide which view to show when back from templates const [view, setView] = useState('') const [policyFormFields, setPolicyFormFields] = useState(newPolicyTemplate) - const [policyStatementsForReview, setPolicyStatementsForReview] = useState([]) + const [policyStatementsForReview, setPolicyStatementsForReview] = useState([]) useEffect(() => { if (visible) { @@ -50,7 +50,7 @@ const StoragePoliciesEditPolicyModal = ({ /* Methods to determine which step to show */ const onViewIntro = () => setView(POLICY_MODAL_VIEWS.SELECTION) - const onViewEditor = (state) => { + const onViewEditor = (state?: any) => { if (state === 'new') { setPolicyFormFields({ ...policyFormFields, @@ -67,7 +67,7 @@ const StoragePoliciesEditPolicyModal = ({ /* Methods for policy templates */ const onSelectBackFromTemplates = () => setView(previousView) - const onUseTemplate = (template) => { + const onUseTemplate = (template: any) => { // Each template has an id as a unique identifier to refresh the SQL editor // but we don't need this property to be in the policyFormField const { id, ...templateFields } = template @@ -81,7 +81,7 @@ const StoragePoliciesEditPolicyModal = ({ } /* Methods for policy editor form fields */ - const onUpdatePolicyName = (name) => { + const onUpdatePolicyName = (name: string) => { if (name.length <= 50) { setPolicyFormFields({ ...policyFormFields, @@ -90,14 +90,14 @@ const StoragePoliciesEditPolicyModal = ({ } } - const onUpdatePolicyDefinition = (definition) => { + const onUpdatePolicyDefinition = (definition: any) => { setPolicyFormFields({ ...policyFormFields, definition, }) } - const onToggleOperation = (operation, isSingleOperation = false) => { + const onToggleOperation = (operation: any, isSingleOperation = false) => { if (isSingleOperation) { return setPolicyFormFields({ ...policyFormFields, @@ -113,7 +113,7 @@ const StoragePoliciesEditPolicyModal = ({ }) } - const onUpdatePolicyRoles = (roles) => { + const onUpdatePolicyRoles = (roles: any) => { setPolicyFormFields({ ...policyFormFields, roles, @@ -150,7 +150,7 @@ const StoragePoliciesEditPolicyModal = ({ onSavePolicy(payloads) } - const onSavePolicy = async (payloads) => { + const onSavePolicy = async (payloads: any) => { const errors = await onCreatePolicies(payloads) const hasErrors = errors.indexOf(true) !== -1 if (hasErrors) { @@ -166,7 +166,7 @@ const StoragePoliciesEditPolicyModal = ({ view, bucketName, onSelectBackFromTemplates = () => {}, - }) => { + }: any) => { const getTitle = () => { if (view === POLICY_MODAL_VIEWS.EDITOR || view === POLICY_MODAL_VIEWS.SELECTION) { return `Adding new policy to ${bucketName}` @@ -234,9 +234,9 @@ const StoragePoliciesEditPolicyModal = ({ /> ) : view === POLICY_MODAL_VIEWS.TEMPLATES ? ( ) : view === POLICY_MODAL_VIEWS.REVIEW ? ( {} ) } -const PolicyAllowedOperations = ({ allowedOperations = [], onToggleOperation = () => {} }) => { +const PolicyAllowedOperations = ({ allowedOperations = [], onToggleOperation = () => {} }: any) => { const allowedClientLibraryMethods = deriveAllowedClientLibraryMethods(allowedOperations) return (
@@ -114,7 +114,7 @@ const StoragePoliciesEditor = ({ onToggleOperation = () => {}, onUpdatePolicyRoles = () => {}, onReviewPolicy = () => {}, -}) => { +}: any) => { const definition = policyFormFields.definition const selectedRoles = policyFormFields.roles diff --git a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.js b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.tsx similarity index 91% rename from apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.js rename to apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.tsx index 60d4be88dc1..cd04add4ea1 100644 --- a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.js +++ b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesPlaceholder.tsx @@ -1,7 +1,7 @@ import Panel from 'components/ui/Panel' import { IconArchive } from 'ui' -const StoragePoliciesPlaceholder = ({ guiHeight }) => ( +const StoragePoliciesPlaceholder = () => ( diff --git a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.js b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.tsx similarity index 93% rename from apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.js rename to apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.tsx index daac85651ab..7a71e07a437 100644 --- a/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.js +++ b/apps/studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePoliciesReview.tsx @@ -10,11 +10,17 @@ const ReviewEmptyState = () => { ) } +interface StoragePoliciesReviewProps { + policyStatements: any[] + onSelectBack: any + onSelectSave: any +} + const StoragePoliciesReview = ({ policyStatements = [], onSelectBack = () => {}, onSelectSave = () => {}, -}) => { +}: StoragePoliciesReviewProps) => { const [isSaving, setIsSaving] = useState(false) const onSavePolicy = () => { setIsSaving(true) diff --git a/apps/studio/components/to-be-cleaned/Storage/index.ts b/apps/studio/components/to-be-cleaned/Storage/index.ts index 74fd858198e..de58d4fb2ee 100644 --- a/apps/studio/components/to-be-cleaned/Storage/index.ts +++ b/apps/studio/components/to-be-cleaned/Storage/index.ts @@ -4,4 +4,4 @@ import StorageSettings from './StorageSettings/StorageSettings' import DeleteBucketModal from './DeleteBucketModal' -export { StorageExplorer, StoragePolicies, StorageSettings, DeleteBucketModal } +export { DeleteBucketModal, StorageExplorer, StoragePolicies, StorageSettings } diff --git a/apps/studio/components/to-be-cleaned/forms/AutoTextArea.js b/apps/studio/components/to-be-cleaned/forms/AutoTextArea.tsx similarity index 87% rename from apps/studio/components/to-be-cleaned/forms/AutoTextArea.js rename to apps/studio/components/to-be-cleaned/forms/AutoTextArea.tsx index b077dbeb326..9b4fd125fd7 100644 --- a/apps/studio/components/to-be-cleaned/forms/AutoTextArea.js +++ b/apps/studio/components/to-be-cleaned/forms/AutoTextArea.tsx @@ -1,7 +1,8 @@ +import { TextAreaProps } from '@ui/components/Input/Input' +import { useRef, useState } from 'react' import { Input } from 'ui' -import React, { useState, useEffect, useRef } from 'react' -const AutoTextArea = (props) => { +const AutoTextArea = (props: TextAreaProps) => { const textAreaRef = useRef(null) const [text, setText] = useState('') const [textAreaHeight, setTextAreaHeight] = useState('auto') diff --git a/apps/studio/components/to-be-cleaned/forms/SchemaForm.js b/apps/studio/components/to-be-cleaned/forms/SchemaForm.tsx similarity index 80% rename from apps/studio/components/to-be-cleaned/forms/SchemaForm.js rename to apps/studio/components/to-be-cleaned/forms/SchemaForm.tsx index 6be0056b6f1..b0ed96b8af5 100644 --- a/apps/studio/components/to-be-cleaned/forms/SchemaForm.js +++ b/apps/studio/components/to-be-cleaned/forms/SchemaForm.tsx @@ -1,7 +1,18 @@ -import { AutoForm } from 'uniforms-bootstrap4' import Ajv from 'ajv' +import { PropsWithChildren } from 'react' +import { AutoForm } from 'uniforms-bootstrap4' import { JSONSchemaBridge } from 'uniforms-bridge-json-schema' +interface SchemaFormProps + extends PropsWithChildren<{ + schema: any + model: any + disabled: boolean + formRef: any + onSubmit: any + onChangeModel: any + }> {} + const SchemaForm = ({ schema, model, @@ -10,7 +21,7 @@ const SchemaForm = ({ formRef, onSubmit, onChangeModel = () => {}, -}) => { +}: SchemaFormProps) => { const validatedSchema = new JSONSchemaBridge(schema, createValidator(schema)) return ( { +const createValidator = (schema: any) => { const validator = ajv.compile(schema) - return (model) => { + return (model: any) => { let cleansedModel = { ...model } Object.entries(cleansedModel).map(([k, v]) => { const isRequired = schema.required.indexOf(k) != -1 @@ -52,7 +63,7 @@ const createValidator = (schema) => { * JSON Schema doesn't support validation for empty strings. * We want to convert all empty strings to NULL to ensure they get validated */ -const nullifyStringIfEmpty = (data) => { +const nullifyStringIfEmpty = (data: any) => { if (data.trim() === '') return null else return data } diff --git a/apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.js b/apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.tsx similarity index 92% rename from apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.js rename to apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.tsx index bf602a1ab6e..433e9ebf568 100644 --- a/apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.js +++ b/apps/studio/components/to-be-cleaned/forms/SchemaFormPanel.tsx @@ -7,7 +7,7 @@ export default function SchemaFormPanel({ title, model, children, - onChangeModel = (model) => {}, + onChangeModel = () => {}, onReset = () => {}, onSubmit, loading, @@ -16,8 +16,8 @@ export default function SchemaFormPanel({ message = '', disabled = false, disabledMessage = '', -}) { - let formRef +}: any) { + let formRef: any const [submitButtonLoading, setSubmitButtonLoading] = useState(false) const [hasChanged, setHasChanged] = useState(false) const isLoading = loading !== undefined ? loading : submitButtonLoading @@ -35,7 +35,7 @@ export default function SchemaFormPanel({ .then(() => { setSubmitButtonLoading(true) }) - .catch((error) => { + .catch((error: any) => { console.error('Error on submitting', error) }) } @@ -81,14 +81,14 @@ export default function SchemaFormPanel({
{ + onChangeModel={(model: any) => { setHasChanged(true) if (onChangeModel) onChangeModel(model) }} - formRef={(ref) => (formRef = ref)} + formRef={(ref: any) => (formRef = ref)} schema={schema} model={model} - onSubmit={async (args) => { + onSubmit={async (args: any) => { onSubmit(args) .then(() => { setSubmitButtonLoading(false) diff --git a/apps/studio/components/ui/Dialogs/ConfirmDialog.js b/apps/studio/components/ui/Dialogs/ConfirmDialog.tsx similarity index 86% rename from apps/studio/components/ui/Dialogs/ConfirmDialog.js rename to apps/studio/components/ui/Dialogs/ConfirmDialog.tsx index d7ad5e3f88b..239b0f3723d 100644 --- a/apps/studio/components/ui/Dialogs/ConfirmDialog.js +++ b/apps/studio/components/ui/Dialogs/ConfirmDialog.tsx @@ -3,6 +3,18 @@ import { Button, Form, Modal } from 'ui' // [Joshen] As of 280222, let's just use ConfirmationModal as the one and only confirmation modal (Deprecate this) +interface ConfirmModalProps { + visible: boolean + danger?: boolean + title: string + description: string + size?: 'tiny' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' + buttonLabel: string + buttonLoadingLabel?: string + onSelectCancel: () => void + onSelectConfirm: () => void +} + const ConfirmModal = ({ visible = false, danger = false, @@ -13,7 +25,7 @@ const ConfirmModal = ({ buttonLoadingLabel = '', onSelectCancel = () => {}, onSelectConfirm = () => {}, -}) => { +}: ConfirmModalProps) => { useEffect(() => { if (visible) { setLoading(false) @@ -42,8 +54,7 @@ const ConfirmModal = ({ validateOnBlur onSubmit={() => onConfirm()} validate={() => { - let errors = [] - return errors + return [] }} > {() => { diff --git a/apps/studio/components/ui/Panel.tsx b/apps/studio/components/ui/Panel.tsx index 2c9d36c60f1..2498f7b4dda 100644 --- a/apps/studio/components/ui/Panel.tsx +++ b/apps/studio/components/ui/Panel.tsx @@ -8,7 +8,7 @@ interface PanelProps { hideHeaderStyling?: boolean loading?: boolean noMargin?: boolean - title?: JSX.Element | false + title?: ReactNode | false wrapWithLoading?: boolean noHideOverflow?: boolean } diff --git a/apps/studio/localStores/storageExplorer/StorageExplorerStore.js b/apps/studio/localStores/storageExplorer/StorageExplorerStore.ts similarity index 99% rename from apps/studio/localStores/storageExplorer/StorageExplorerStore.js rename to apps/studio/localStores/storageExplorer/StorageExplorerStore.ts index 1fb1c80ed15..6e7740e8111 100644 --- a/apps/studio/localStores/storageExplorer/StorageExplorerStore.js +++ b/apps/studio/localStores/storageExplorer/StorageExplorerStore.ts @@ -1,3 +1,5 @@ +// @ts-nocheck + import { createClient } from '@supabase/supabase-js' import { BlobReader, BlobWriter, ZipWriter } from '@zip.js/zip.js' import { chunk, compact, find, findIndex, has, isEqual, some, uniq, uniqBy } from 'lodash' diff --git a/apps/studio/tsconfig.json b/apps/studio/tsconfig.json index ab5a90595ea..677ac2f3da9 100644 --- a/apps/studio/tsconfig.json +++ b/apps/studio/tsconfig.json @@ -2,7 +2,7 @@ "compilerOptions": { "target": "es5", "lib": ["dom", "dom.iterable", "esnext"], - "allowJs": true, + "allowJs": false, "skipLibCheck": true, "strict": true, "forceConsistentCasingInFileNames": true,