Fetching access token...
+ }
+
+ return (
+ <>
+
+
+
+ {message == null ? 'Loading...' : message}
+{left}
+ {label}
+ {right}
+ {label}
+ {label}
+
+
+
+
+
+
+
+
+
+ {children}
+
+
+
+
+
+
+ {currentUserIsCoreMember && (
+
+
+
+
+ FOLDERS
+ {showCreateButtons && (
+
+
+ )}
+ DOCUMENTS
+
+
+ {showingStatusFilterContextMenu && (
+
+
+ )}
+
+ toggleStatusFilter('in_progress')}
+ label={
+
+
+
+ }
+ />
+
+ In Progress
+
+
+ toggleStatusFilter('paused')}
+ label={
+
+
+
+ }
+ />
+
+ Paused
+
+
+ toggleStatusFilter('completed')}
+ label={
+
+
+
+ }
+ />
+
+ Completed
+
+
+ toggleStatusFilter('archived')}
+ label={
+
+
+
+ }
+ />
+
+ Archived
+
+
+
+
+
+ {sending && (
+
+
+ Loading...
You can sign in via E-mail.
+ ) : ( +You can sign in via Google, Github and E-mail
+ )} + + ) +} + +export default NativeMobileAuthForm diff --git a/src/mobile/components/organisms/Navigator/Navigator.tsx b/src/mobile/components/organisms/Navigator/Navigator.tsx new file mode 100644 index 0000000000..3134eae903 --- /dev/null +++ b/src/mobile/components/organisms/Navigator/Navigator.tsx @@ -0,0 +1,189 @@ +import React, { useCallback, MouseEvent } from 'react' +import cc from 'classcat' +import styled from '../../../../shared/lib/styled' +import Spinner from '../../../../shared/components/atoms/Spinner' +import { SerializedTeam } from '../../../../cloud/interfaces/db/team' +import NavigatorSpaceSelector from './NavigatorSpaceSelector' +import NavigatorTree from './NavigatorTree' +import Icon from '../../../../shared/components/atoms/Icon' +import { useGlobalData } from '../../../../cloud/lib/stores/globalData' +import { usePreferences } from '../../../lib/preferences' +import { + mdiSortAlphabeticalAscending, + mdiSortAlphabeticalDescending, + mdiSortClockAscendingOutline, +} from '@mdi/js' +import { + useContextMenu, + MenuTypes, +} from '../../../../shared/lib/stores/contextMenu' +import { NavigatorCategory } from '../../../lib/sidebar/useNavigatorTree' + +type NavigatorProps = { + sidebarExpandedWidth?: number + sidebarResize?: (width: number) => void + className?: string + tree?: NavigatorCategory[] + treeTopRows?: React.ReactNode + currentTeam?: SerializedTeam +} + +const Navigator = ({ + currentTeam, + tree, + treeTopRows, + className, +}: NavigatorProps) => { + const { + globalData: { teams, invites }, + } = useGlobalData() + const { preferences, setPreferences } = usePreferences() + const { popup } = useContextMenu() + + const popupTreeSortingOrder = useCallback( + (event: MouseEvent) => { + popup(event, [ + { + type: MenuTypes.Normal, + label: ( + <> +
+
+
+
+ {tree == null ? (
+
+
+ {showCreateForm && (
+ {
+ setCreationFormIsOpened(false)
+ setShowCreateForm(false)
+ }}
+ createCallback={creationCallbackRef.current}
+ />
+ )}
+ {category.rows.map((row) => (
+
+ )}
+ {label}
+
+ {folded != null && (
+
+ )}
+
+ {emoji != null ? (
+
+ {(controls != null || contextControls != null) && (
+
+
+ {(controls || []).map((control, i) => (
+
+ ))}
+ {contextControls != null && (
+
+ )}
+
+ {
+ setCreationFormIsOpened(false)
+ setShowCreateForm(false)
+ }}
+ createCallback={creationCallbackRef.current}
+ />
+ )}
+ {!row.folded &&
+ (row.rows || []).map((child) => (
+
+ )
+}
+
+export default NavigatorNestedTreeRow
diff --git a/src/mobile/components/organisms/Navigator/NavigatorSpaceSelector.tsx b/src/mobile/components/organisms/Navigator/NavigatorSpaceSelector.tsx
new file mode 100644
index 0000000000..12f3c3c245
--- /dev/null
+++ b/src/mobile/components/organisms/Navigator/NavigatorSpaceSelector.tsx
@@ -0,0 +1,155 @@
+import React, { useCallback } from 'react'
+import {
+ useContextMenu,
+ MenuTypes,
+ NormalMenuItem,
+} from '../../../../shared/lib/stores/contextMenu'
+import { SerializedTeam } from '../../../../cloud/interfaces/db/team'
+import { useRouter } from '../../../../cloud/lib/router'
+import { SerializedTeamInvite } from '../../../../cloud/interfaces/db/teamInvite'
+import { getHexFromUUID } from '../../../../cloud/lib/utils/string'
+import { stringify as stringifyQueryString } from 'querystring'
+import RoundedImage from '../../../../shared/components/atoms/RoundedImage'
+import Icon from '../../../../shared/components/atoms/Icon'
+import { mdiUnfoldMoreHorizontal } from '@mdi/js'
+import styled from '../../../../shared/lib/styled'
+import SpaceMenuItemLabel from './SpaceMenuItemLabel'
+import useSignOut from '../../../lib/signOut'
+import { buildIconUrl } from '../../../../cloud/api/files'
+import { boostHubBaseUrl } from '../../../../cloud/lib/consts'
+
+interface NavigatorSpaceSelectorProps {
+ currentTeam?: SerializedTeam
+ teams: SerializedTeam[]
+ invites: SerializedTeamInvite[]
+}
+
+const NavigatorSpaceSelector = ({
+ currentTeam,
+ teams,
+ invites,
+}: NavigatorSpaceSelectorProps) => {
+ const { popup } = useContextMenu()
+ const { push } = useRouter()
+ const signOut = useSignOut()
+
+ const popupSpaceSelect = useCallback(
+ (event: React.MouseEvent) => {
+ popup(event, [
+ ...teams.map((team) => {
+ return {
+ type: MenuTypes.Normal,
+ label: {currentTeam.name}
+
+ ) : (
+ No team selected
+ )}
+
+ {topRows}
+ )}
+
+ {tree.map((category, i) => {
+ if (category.hidden) {
+ return null
+ }
+
+ return (
+ {team.name}
+ + +
Delete Account
++ You may delete your account at any time, note that this is + unrecoverable. +
+ +
+
+
+
+
+
+
+
+
+
+ {subscription == null ? (
+
+ */}
+
+ {currentUserPermissions != null && (
+ <>
+
+
+
+ {!team.personal && (
+
+ {translate(lngKeys.DocInfo)}
+
+
+
+
+ )}
+
+
+
+ assignee.userId
+ )
+ : []
+ }
+ readOnly={!currentUserIsCoreMember}
+ update={sendUpdateDocAssignees}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {!team.personal && creator != null && (
+
+
+ {getFormattedDateTime(
+ currentDoc.createdAt,
+ undefined,
+ 'MMM dd, yyyy, HH:mm'
+ )}
+
+
+
+
+
+ )}
+
+
+
+
+
+
+
+ {!team.personal && (
+
+
+ {currentDoc.head != null
+ ? getFormattedDateTime(
+ currentDoc.head.created,
+ undefined,
+ 'MMM dd, yyyy, HH:mm'
+ )
+ : getFormattedDateTime(
+ currentDoc.updatedAt,
+ undefined,
+ 'MMM dd, yyyy, HH:mm'
+ )}
+
+
+
+
+
+ )}
+ {!team.personal && (
+
+
+ {currentDoc.head != null ? (
+ (currentDoc.head.creators || []).length > 0 ? (
+ <>
+ {(currentDoc.head.creators || []).map((user) => (
+
+
+
+
+
+ )}
+ {/*
+
+ {contributorsState.contributors.map((contributor) => (
+
+ setSliceContributors((prev) => !prev)
+ }
+ >
+ {contributorsState.sliced > 0
+ ? `+${contributorsState.sliced}`
+ : '-'}
+
+ )}
+
+
+
+
+
+ {translate(lngKeys.Share)}
+
+
+
+
+
+ )}
+
+ )}
+ -
+ {backLinks.map((doc) => (
+
-
+
+ ++ {getDocTitle(doc)} +
+ ))}
+
+
+ )
+ }
+
+ if (subscription == null && currentUserPermissions != null) {
+ return (
+
+
+ )
+ }
+
+ return
+ Let's upgrade to the Pro plan now and protect your shared
+ documents with a password.
+
You can try a two-week trial for free!
+
+ {rightSideContent}
+
+
+
+
+
+ onSubmit(value, emoji)}
+ >
+ {submitButtonProps.label}
+
+
+
+ You need to be connected.
+You need to select a valid team.
+
+ {formtab == null ? (
+ setFormTab('email')}
+ onMethodClick={() => setFormTab('method')}
+ onPromoClick={() => setFormTab('promo')}
+ />
+ ) : (
+
+ {formtab === 'email' ? (
+ setFormTab(undefined)}
+ />
+ ) : formtab === 'method' ? (
+
+ setFormTab(undefined)}
+ />
+
+ ) : formtab === 'promo' ? (
+ setFormTab(undefined)}
+ />
+ ) : null}
+
+ )}
+
+
+ }
+ />
+ Current Members
+ {fetching.has('userEmails') && ( +
+
+ {currentUserPermissions.user.displayName}
+ {currentUserIsAdmin &&
+ userEmailsMap.has(currentUserPermissions.id) && (
+
+ {userEmailsMap.get(currentUserPermissions.id)}
+
+ )}
+
+
+
+
+ Current Members
+ {fetching.has('userEmails') && ( +
+
+ {permission.user.displayName}
+ {currentUserIsAdmin &&
+ userEmailsMap.has(permission.id) && (
+
+ {userEmailsMap.get(permission.id)}
+
+ )}
+
+
+
+
+
+ {sending === `${permission.id}-change` ? (
+
+ changePermissionsRole(
+ value,
+ currentUserPermissions,
+ permission
+ )
+ }
+ isDisabled={
+ !currentUserIsAdmin ||
+ targetPermissionsAreUsersOwn
+ }
+ options={['admin', 'member', 'viewer']}
+ />
+ )}
+ {(targetPermissionsAreUsersOwn ||
+ currentUserIsAdmin) && (
+ removePermissions(permission)}
+ disabled={sending != null}
+ style={{ width: 80 }}
+ >
+ {sending === `${permission.id}-delete` ? (
+
+ )}
+
+ Delete Space
+
+ Once you delete this space we will remove all associated data. There
+ is no turning back.{' '}
+
+
+
+
+
+ + Currently updating subscription plan is not available from mobile + app. Please use the link below to update it. +
++ Current subscription plan:{' '} + {subscription == null + ? 'Not Available' + : `${subscription.plan} (${subscription.status})`} +
+
+ //
+ //
+ //
+ //
+ //
+ // {isTabOpen('free') && (
+ //
+ //
+ // )}
+ //
+ // $0
+ //
+ // -
+ //
-
+ //
+ // 10 docs per team + //
+ // -
+ //
+ // Unlimited members + //
+ // -
+ //
+ // 100MB storage per member + //
+ //
+ //
+ //
+ //
+ //
+ //
+
+ // {isTabOpen('standard') && (
+ //
+ //
+ // )}
+ //
+ // $3
+ //
+ // per person per month
+ //
+ //
+ // -
+ //
-
+ //
+ // Collaborative workspace + //
+ // -
+ //
+ // Unlimited documents + //
+ // -
+ //
+ // Unlimited members + //
+ // -
+ //
+ // 1GB storage per member + //
+ // -
+ //
7 days revision history + //
+ //
+ //
+ //
+ //
+ //
+ //
+
+ // {isTabOpen('pro') && (
+ //
+ //
+ // )}
+ //
+ // $8
+ //
+ // per person per month
+ //
+ //
+ // -
+ //
-
+ //
+ // Everything in Standard + //
+ // -
+ //
+ // Guest invite + //
+ // -
+ //
+ // Password/Expiration date for sharing + //
+ // -
+ //
+ // 10GB storage per member + //
+ // -
+ //
+ // Priority support + //
+ //
Do you need more than 30 docs?
+
+
+
+
+ )}
+ {variant == 'version-history' && (
+ <>
+ + The Free plan lets you create 30 docs per team, but you can + make it unlimited by choosing either the Standard plan ($3~) + or Pro plan ($8~) if you need more than that. +
+Check the pricing table to learn more!
++ Want to check this document's history? +
+
+
+
+
+ )}
+ {variant == 'sharing-options' && (
+ <>
+ + Check the revision history of a document. Boost Note + automatically stores all changes for every document. If you + find a broken document, you can easily roll back to one of the + previous versions in one click. +
++ Each history lasts 7 days for the Standard plan and keeps + forever for the Pro plan! +
+Unlock detailed sharing options?
+
+
+
+
+ )}
+ + Setting passwords and adding expiration dates for sharing is + one of the Pro plan features. If you want to share your + documents publicly but with some protection, these sharing + options would be perfect for you! +
++ Check the details of the Pro plan and learn what you can do + with this plan! +
+{label}
+ {children != null && ( +{children}
+ )}
+
+ {folded != null && (
+
+ )}
+ setFocused(true)}
+ onClick={onClick}
+ href={labelHref}
+ id={`search-${id}`}
+ tabIndex={1}
+ >
+
+
+
+ {emoji != null ? (
+
+ {contexts != null && !folded && (
+
+ {contexts.map((context, i) => (
+
+ )}
+
+ {highlighted == null
+ ? context
+ : highlightMatch(context, highlighted)}
+
+ ))}
+
+
+ {closeLabel}
+
+ }
+ />
+
+ {children}
+ {user.displayName}
+
+
+ )
+ case 'paused':
+ return (
+
+
+ )
+ case 'completed':
+ return (
+
+
+ )
+ case 'archived':
+ return (
+
+
+ )
+ }
+ return (
+ {translate(lngKeys.NoStatus)}
+ )
+}
diff --git a/src/mobile/components/organisms/modals/organisms/DocInfoModalShareSection.tsx b/src/mobile/components/organisms/modals/organisms/DocInfoModalShareSection.tsx
new file mode 100644
index 0000000000..8fe3bdfb5f
--- /dev/null
+++ b/src/mobile/components/organisms/modals/organisms/DocInfoModalShareSection.tsx
@@ -0,0 +1,697 @@
+import React, { useState, useCallback, useMemo, useEffect } from 'react'
+import { SerializedDocWithBookmark } from '../../../../../cloud/interfaces/db/doc'
+import { useNav } from '../../../../../cloud/lib/stores/nav'
+import { usePage } from '../../../../../cloud/lib/stores/pageStore'
+import {
+ createShareLink,
+ deleteShareLink,
+ regenerateShareLink,
+ updateShareLink,
+} from '../../../../../cloud/api/share'
+import {
+ mdiChevronDown,
+ mdiChevronRight,
+ mdiOpenInNew,
+ mdiClipboardTextOutline,
+ mdiLinkVariant,
+ mdiClipboardCheckOutline,
+ mdiWeb,
+} from '@mdi/js'
+
+import copy from 'copy-to-clipboard'
+import { inputStyle } from '../../../../../shared/lib/styled/styleFunctions'
+import DatePicker from 'react-datepicker'
+import { isArray } from 'util'
+import 'react-datepicker/dist/react-datepicker.css'
+import { boostHubBaseUrl } from '../../../../../cloud/lib/consts'
+import { SerializedTeam } from '../../../../../cloud/interfaces/db/team'
+
+import { useToast } from '../../../../../shared/lib/stores/toast'
+import Button from '../../../../../shared/components/atoms/Button'
+import Switch from '../../../../../shared/components/atoms/Switch'
+import { useI18n } from '../../../../../cloud/lib/hooks/useI18n'
+import { lngKeys } from '../../../../../cloud/lib/i18n/types'
+import { capitalize } from '../../../../../cloud/lib/utils/string'
+import Spinner from '../../../../../shared/components/atoms/Spinner'
+import Icon from '../../../../../shared/components/atoms/Icon'
+import styled from '../../../../../shared/lib/styled'
+import Flexbox from '../../../../../shared/components/atoms/Flexbox'
+import UpgradeIntroButton from '../../../atoms/UpgradeIntroModalButton'
+import { agentType, sendPostMessage } from '../../../../lib/nativeMobile'
+import { getDocLinkHref } from '../../../../lib/href'
+
+interface DocInfoModalShareSectionProps {
+ currentDoc: SerializedDocWithBookmark
+ team: SerializedTeam
+}
+
+type SendingState =
+ | 'idle'
+ | 'toggling'
+ | 'regenerating'
+ | 'password'
+ | 'expireDate'
+
+const DocInfoModalShareSection = ({
+ currentDoc,
+ team,
+}: DocInfoModalShareSectionProps) => {
+ const { translate } = useI18n()
+ const [sending, setSending] = useState
+
+
+
+ )}
+
+
+ )}
+ onDeleteHandler(tag.id)}
+ >
+ {removing === tag.id ? (
+
+ )}
+
+ {sending && (
+
+ )}
+
+ {autoCompleteOptions.map((option, i) => (
+ selectOptionHandler(e, option.value)}
+ >
+ {option.label}
+
+ ))}
+
+ )}
+
+ {searchQuery.trim() === '' && (
+ <>
+ {recentlyVisited.length > 0 && (
+ <>
+ remove('history')}
+ fold={() => add('history')}
+ toggle={() => toggle('history')}
+ className='sidebar__search__category'
+ >
+ Recently Visited
+
+ {!has('history') &&
+ recentlyVisited.map((item, i) => (
+ remove('keywords')}
+ fold={() => add('keywords')}
+ toggle={() => toggle('keywords')}
+ className='sidebar__search__category'
+ >
+ Recent Keywords
+
+ {!has('keywords') &&
+ recentlySearched.map((keyword) => (
+ setSearchQuery(keyword)}
+ key={`recently-searched-${keyword}`}
+ id={`recently-searched-${keyword}`}
+ />
+ ))}
+
+ )}
+
+ )}
+
+ {searchQuery.trim() !== '' && (fetching || !isNotDebouncing) && (
+ <>
+ {fetching ? (
+ remove('matches')}
+ fold={() => add('matches')}
+ toggle={() => toggle('matches')}
+ className='sidebar__search__category'
+ >
+ {results.items.length}{' '}
+ {plur('item', results.items.length)}
+
+ {!has('matches') &&
+ results.items.map((result, i) => (
+ remove('context__matches')}
+ fold={() => add('context__matches')}
+ toggle={() => toggle('context__matches')}
+ className='sidebar__search__category'
+ >
+ Found in {results.contextItems.length}{' '}
+ {plur('item', results.contextItems.length)}
+
+ {!has('context__matches') &&
+ results.contextItems.map((result, i) => (
+
+ remove(`${result.label}-${i}`),
+ fold: () => add(`${result.label}-${i}`),
+ toggle: () =>
+ toggle(`${result.label}-${i}`),
+ }
+ : undefined
+ }
+ />
+ ))}
+
+ )}
+
+ )}
+
+ {results.similar.length === 0 ? null : (
+ <>
+
+ remove('similarities')}
+ fold={() => add('similarities')}
+ toggle={() => toggle('similarities')}
+ className='sidebar__search__category'
+ >
+ {results.similar.length} Similar{' '}
+ {plur('result', results.similar.length)}
+
+ {!has('similarities') &&
+ results.similar.map((result, i) => (
+
+ ..
+ )}
+
+ )}
+
+ {searchQuery.trim() !== '' &&
+ searchResults.length === 0 &&
+ !fetching &&
+ isNotDebouncing && (
+ <>
+ No results
+
+ Try a different query.
+
+
+ )}
+
+ {searchQuery.trim() !== '' &&
+ searchResults.length > 0 &&
+ !fetching &&
+ isNotDebouncing && (
+ <>
+ {results.items.length + results.contextItems.length === 0 ? (
+ <>
+
+ No matches
+
+
+ Try a different query.
+
+
+ ) : (
+ <>
+ {results.items.length === 0 ? null : (
+ <>
+ + {action === 'Create' + ? translate(lngKeys.ModalsSmartFolderCreateTitle) + : translate(lngKeys.ModalsSmartFolderEditTitle)} +
+ +
+
+ + How are you planning to use Boost Note? +
+ ++ We'll streamline your setup experience accordingly. +
+
+
+
+
+
+
+
+
+
+
+
+ Invite your teammates
+
+
+
+
+
+
+
+
+
+ Create a team space
+ ++ Please tell us your team information. +
+ +
+
+ Please let us know the reasons why so that we can further improve our + product. +
+
+
+
+ {feedback.needFeatures && (
+