Merge pull request #3020 from omnivore-app/feat/web-show-account-limits

Display account size
This commit is contained in:
Jackson Harper 2023-10-26 13:25:49 +08:00 committed by GitHub
commit 4cbb696886
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 9 deletions

View file

@ -8,7 +8,7 @@ import {
} from '../../components/elements/LayoutPrimitives'
import { StyledText } from '../../components/elements/StyledText'
import { SettingsLayout } from '../../components/templates/SettingsLayout'
import { styled } from '../../components/tokens/stitches.config'
import { styled, theme } from '../../components/tokens/stitches.config'
import { updateEmailMutation } from '../../lib/networking/mutations/updateEmailMutation'
import { updateUserMutation } from '../../lib/networking/mutations/updateUserMutation'
import { updateUserProfileMutation } from '../../lib/networking/mutations/updateUserProfileMutation'
@ -18,6 +18,9 @@ import { useValidateUsernameQuery } from '../../lib/networking/queries/useValida
import { applyStoredTheme } from '../../lib/themeUpdater'
import { showErrorToast, showSuccessToast } from '../../lib/toastHelpers'
import { ConfirmationModal } from '../../components/patterns/ConfirmationModal'
import { ProgressBar } from '../../components/elements/ProgressBar'
const ACCOUNT_LIMIT = 50_000
const StyledLabel = styled('label', {
fontWeight: 600,
@ -371,7 +374,7 @@ export default function Account(): JSX.Element {
</form>
</VStack>
{/* <VStack
<VStack
css={{
padding: '24px',
width: '100%',
@ -385,18 +388,23 @@ export default function Account(): JSX.Element {
{!isValidating && (
<>
<ProgressBar
fillPercentage={(libraryCount ?? 0) / 50000}
fillPercentage={((libraryCount ?? 0) / ACCOUNT_LIMIT) * 100}
fillColor={theme.colors.omnivoreCtaYellow.toString()}
backgroundColor={theme.colors.grayText.toString()}
borderRadius={'2px'}
/>
<StyledText style="footnote" css={{ mt: '0px', mb: '20px' }}>
{`${libraryCount} of 50K library items used.`}
<StyledText style="footnote" css={{ mt: '0px' }}>
{`${libraryCount} of ${ACCOUNT_LIMIT} library items used.`}
</StyledText>
<StyledText style="footnote" css={{ m: '0px' }}>
NOTE: this is a soft limit, if you are approaching or have
exceeded this limit please contact support to have your limit
raised.
</StyledText>
</>
)}
<Button style="ctaDarkYellow">Upgrade</Button>
</VStack> */}
{/* <Button style="ctaDarkYellow">Upgrade</Button> */}
</VStack>
<VStack
css={{

View file

@ -13,6 +13,7 @@ import { HStack, VStack } from '../../components/elements/LayoutPrimitives'
import { useGetViewerQuery } from '../../lib/networking/queries/useGetViewerQuery'
import { Loader } from '../../components/templates/SavingRequest'
import { deleteAccountMutation } from '../../lib/networking/mutations/deleteAccountMutation'
import Link from 'next/link'
export default function DeleteMyAccount(): JSX.Element {
const router = useRouter()
@ -89,8 +90,18 @@ export default function DeleteMyAccount(): JSX.Element {
distribution="start"
alignment="start"
>
Deleting your account will delete all your saved items, notes, and
highlights. This operation can not be undone.
<p>
Deleting your account will delete all your saved items, notes, and
highlights. This operation can not be undone. Note that once your
account is deleted you will not be able to create a new account
with the same username/email for at least 24hrs.
</p>
<p>
If you are deleting your account because you&apos;ve imported too
many items, and want a &quot;fresh start&quot; you can try using
the <Link href="/tools/bulk">bulk tool</Link> to clean up your
account instead.
</p>
{viewer && router ? (
<Button
style="ctaDarkYellow"