chore(release): publish

- @standardnotes/[email protected].1
 - @standardnotes/[email protected]
 - @standardnotes/[email protected].0
 - @standardnotes/[email protected].2
 - @standardnotes/[email protected].2
 - @standardnotes/[email protected].5
 - @standardnotes/[email protected]
 - @standardnotes/[email protected].2
 - @standardnotes/[email protected].0
 - @standardnotes/[email protected]
 - @standardnotes/[email protected].0

packages/api/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.16.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/api
+
 # [1.16.0](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 ### Features

packages/api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/api",
-  "version": "1.16.0",
+  "version": "1.16.1",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/desktop/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.23.212](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/desktop
+
+## [3.23.211](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/desktop
+
+## [3.23.210](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/desktop
+
 ## [3.23.209](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/desktop

packages/desktop/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@standardnotes/desktop",
   "main": "./app/dist/index.js",
-  "version": "3.23.209",
+  "version": "3.23.212",
   "license": "AGPL-3.0-or-later",
   "author": "Standard Notes.",
   "private": true,

packages/encryption/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.18.0](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+### Features
+
+* replace private workspaces with private usernames ([#1783](https://github.com/standardnotes/app/issues/1783)) ([18c821d](https://github.com/standardnotes/app/commit/18c821d8eb51beb6f54211eb1d6eb454303044f5))
+
 ## [1.17.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-11)
 
 **Note:** Version bump only for package @standardnotes/encryption

packages/encryption/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/encryption",
-  "version": "1.17.1",
+  "version": "1.18.0",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/encryption/src/Domain/Username/PrivateUsername.ts

@@ -0,0 +1,19 @@
+import { PureCryptoInterface } from '@standardnotes/sncrypto-common'
+
+const PrivateUserNameV1 = 'StandardNotes-PrivateUsername-V1'
+
+export async function ComputePrivateUsername(
+  crypto: PureCryptoInterface,
+  usernameInput: string,
+): Promise<string | undefined> {
+  const result = await crypto.hmac256(
+    await crypto.sha256(PrivateUserNameV1),
+    await crypto.sha256(usernameInput.trim().toLowerCase()),
+  )
+
+  if (result == undefined) {
+    return undefined
+  }
+
+  return result
+}

packages/encryption/src/Domain/Workspace/PrivateWorkspace.ts

@@ -1,18 +0,0 @@
-import { PureCryptoInterface } from '@standardnotes/sncrypto-common'
-
-export async function ComputePrivateWorkspaceIdentifier(
-  crypto: PureCryptoInterface,
-  userphrase: string,
-  name: string,
-): Promise<string | undefined> {
-  const identifier = await crypto.hmac256(
-    await crypto.sha256(name.trim().toLowerCase()),
-    await crypto.sha256(userphrase.trim().toLowerCase()),
-  )
-
-  if (identifier == undefined) {
-    return undefined
-  }
-
-  return identifier
-}

packages/encryption/src/Domain/index.ts

@@ -34,4 +34,4 @@ export * from './Types/EncryptedParameters'
 export * from './Types/ItemAuthenticatedData'
 export * from './Types/LegacyAttachedData'
 export * from './Types/RootKeyEncryptedAuthenticatedData'
-export * from './Workspace/PrivateWorkspace'
+export * from './Username/PrivateUsername'

packages/filepicker/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.24.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/filepicker
+
 ## [1.24.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-11)
 
 **Note:** Version bump only for package @standardnotes/filepicker

packages/filepicker/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/filepicker",
-  "version": "1.24.1",
+  "version": "1.24.2",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/files/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.11.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/files
+
 ## [1.11.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-11)
 
 **Note:** Version bump only for package @standardnotes/files

packages/files/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/files",
-  "version": "1.11.1",
+  "version": "1.11.2",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/mobile/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.42.5](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/mobile
+
+## [3.42.4](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/mobile
+
+## [3.42.3](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/mobile
+
 ## [3.42.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/mobile

packages/mobile/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/mobile",
-  "version": "3.42.2",
+  "version": "3.42.5",
   "author": "Standard Notes.",
   "private": true,
   "license": "AGPL-3.0-or-later",

packages/mobile/src/Hooks/useFiles.ts

@@ -68,7 +68,7 @@ export const useFiles = ({ note }: Props) => {
   const filesService = application.getFilesService()
 
   const reloadAttachedFiles = useCallback(() => {
-    setAttachedFiles(application.items.getSortedFilesForItem(note).sort(filesService.sortByName))
+    setAttachedFiles(application.items.getSortedFilesLinkingToItem(note).sort(filesService.sortByName))
   }, [application.items, filesService.sortByName, note])
 
   const reloadAllFiles = useCallback(() => {

packages/mobile/src/Screens/SideMenu/NoteSideMenu.tsx

@@ -139,7 +139,7 @@ export const NoteSideMenu = React.memo((props: Props) => {
       setAttachedFilesLength(0)
       return
     }
-    setAttachedFilesLength(application.items.getSortedFilesForItem(note).length)
+    setAttachedFilesLength(application.items.getSortedFilesLinkingToItem(note).length)
   }, [application, note])
 
   useEffect(() => {
@@ -147,7 +147,7 @@ export const NoteSideMenu = React.memo((props: Props) => {
       return
     }
     const removeFilesObserver = application.streamItems(ContentType.File, () => {
-      setAttachedFilesLength(application.items.getSortedFilesForItem(note).length)
+      setAttachedFilesLength(application.items.getSortedFilesLinkingToItem(note).length)
     })
     return () => {
       removeFilesObserver()

packages/releases/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.3.140](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/releases
+
+## [1.3.139](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/releases
+
+## [1.3.138](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/releases
+
 ## [1.3.137](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/releases

packages/releases/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/releases",
-  "version": "1.3.137",
+  "version": "1.3.140",
   "license": "AGPL-3.0-or-later",
   "main": "dist/releases.json",
   "types": "dist/index.d.ts",

packages/services/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.32.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/services
+
+## [1.32.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/services
+
 # [1.32.0](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 ### Features

packages/services/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/services",
-  "version": "1.32.0",
+  "version": "1.32.2",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/services/src/Domain/Item/ItemsClientInterface.ts

@@ -114,7 +114,9 @@ export interface ItemsClientInterface {
    * @returns Array containing tags associated with an item
    */
   getSortedTagsForItem(item: DecryptedItemInterface<ItemContent>): SNTag[]
-  getSortedFilesForItem(item: DecryptedItemInterface<ItemContent>): FileItem[]
+
+  getSortedLinkedFilesForItem(item: DecryptedItemInterface<ItemContent>): FileItem[]
+  getSortedFilesLinkingToItem(item: DecryptedItemInterface<ItemContent>): FileItem[]
 
   getSortedLinkedNotesForItem(item: DecryptedItemInterface<ItemContent>): SNNote[]
   getSortedNotesLinkingToItem(item: DecryptedItemInterface<ItemContent>): SNNote[]

packages/snjs/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.139.0](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+### Features
+
+* replace private workspaces with private usernames ([#1783](https://github.com/standardnotes/app/issues/1783)) ([18c821d](https://github.com/standardnotes/app/commit/18c821d8eb51beb6f54211eb1d6eb454303044f5))
+
+## [2.138.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/snjs
+
 ## [2.138.1](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/snjs

packages/snjs/lib/Application/Application.ts

@@ -53,7 +53,7 @@ import {
   WorkspaceManager,
 } from '@standardnotes/services'
 import { FilesClientInterface } from '@standardnotes/files'
-import { ComputePrivateWorkspaceIdentifier } from '@standardnotes/encryption'
+import { ComputePrivateUsername } from '@standardnotes/encryption'
 import { useBoolean } from '@standardnotes/utils'
 import {
   BackupFile,
@@ -272,8 +272,8 @@ export class SNApplication
     return this.componentManagerService
   }
 
-  public computePrivateWorkspaceIdentifier(userphrase: string, name: string): Promise<string | undefined> {
-    return ComputePrivateWorkspaceIdentifier(this.options.crypto, userphrase, name)
+  public computePrivateUsername(username: string): Promise<string | undefined> {
+    return ComputePrivateUsername(this.options.crypto, username)
   }
 
   /**

packages/snjs/lib/Services/Items/ItemManager.spec.ts

@@ -805,7 +805,7 @@ describe('itemManager', () => {
 
       await itemManager.associateFileWithNote(file, note)
 
-      const filesAssociatedWithNote = itemManager.getSortedFilesForItem(note)
+      const filesAssociatedWithNote = itemManager.getSortedFilesLinkingToItem(note)
 
       expect(filesAssociatedWithNote).toHaveLength(1)
       expect(filesAssociatedWithNote[0].uuid).toBe(file.uuid)
@@ -873,20 +873,38 @@ describe('itemManager', () => {
 
     it('should get all linked files for item', async () => {
       itemManager = createService()
-      const note = createNote('note')
       const file = createFile('A1')
       const file2 = createFile('B2')
+      const file3 = createFile('C3')
 
-      await itemManager.insertItems([note, file, file2])
+      await itemManager.insertItems([file, file2, file3])
 
-      await itemManager.associateFileWithNote(file2, note)
-      await itemManager.associateFileWithNote(file, note)
+      await itemManager.linkFileToFile(file, file3)
+      await itemManager.linkFileToFile(file, file2)
 
-      const sortedFilesForItem = itemManager.getSortedFilesForItem(note)
+      const sortedFilesForItem = itemManager.getSortedLinkedFilesForItem(file)
 
       expect(sortedFilesForItem).toHaveLength(2)
-      expect(sortedFilesForItem[0].uuid).toEqual(file.uuid)
-      expect(sortedFilesForItem[1].uuid).toEqual(file2.uuid)
+      expect(sortedFilesForItem[0].uuid).toEqual(file2.uuid)
+      expect(sortedFilesForItem[1].uuid).toEqual(file3.uuid)
+    })
+
+    it('should get all files linking to item', async () => {
+      itemManager = createService()
+      const baseFile = createFile('file')
+      const fileToLink1 = createFile('A1')
+      const fileToLink2 = createFile('B2')
+
+      await itemManager.insertItems([baseFile, fileToLink1, fileToLink2])
+
+      await itemManager.linkFileToFile(fileToLink2, baseFile)
+      await itemManager.linkFileToFile(fileToLink1, baseFile)
+
+      const sortedFilesForItem = itemManager.getSortedFilesLinkingToItem(baseFile)
+
+      expect(sortedFilesForItem).toHaveLength(2)
+      expect(sortedFilesForItem[0].uuid).toEqual(fileToLink1.uuid)
+      expect(sortedFilesForItem[1].uuid).toEqual(fileToLink2.uuid)
     })
 
     it('should get all linked notes for item', async () => {

packages/snjs/lib/Services/Items/ItemManager.ts

@@ -1192,7 +1192,19 @@ export class ItemManager
     )
   }
 
-  public getSortedFilesForItem(item: DecryptedItemInterface<ItemContent>): Models.FileItem[] {
+  public getSortedLinkedFilesForItem(item: DecryptedItemInterface<ItemContent>): Models.FileItem[] {
+    if (this.isTemplateItem(item)) {
+      return []
+    }
+
+    const filesReferencedByItem = this.referencesForItem(item).filter(
+      (ref) => ref.content_type === ContentType.File,
+    ) as Models.FileItem[]
+
+    return naturalSort(filesReferencedByItem, 'title')
+  }
+
+  public getSortedFilesLinkingToItem(item: DecryptedItemInterface<ItemContent>): Models.FileItem[] {
     if (this.isTemplateItem(item)) {
       return []
     }
@@ -1200,11 +1212,8 @@ export class ItemManager
     const filesReferencingItem = this.itemsReferencingItem(item).filter(
       (ref) => ref.content_type === ContentType.File,
     ) as Models.FileItem[]
-    const filesReferencedByItem = this.referencesForItem(item).filter(
-      (ref) => ref.content_type === ContentType.File,
-    ) as Models.FileItem[]
 
-    return naturalSort(filesReferencingItem.concat(filesReferencedByItem), 'title')
+    return naturalSort(filesReferencingItem, 'title')
   }
 
   public getSortedLinkedNotesForItem(item: DecryptedItemInterface<ItemContent>): Models.SNNote[] {

packages/snjs/mocha/test.html

@@ -43,7 +43,7 @@
   <script type="module" src="002.test.js"></script>
   <script type="module" src="003.test.js"></script>
   <script type="module" src="004.test.js"></script>
-  <script type="module" src="workspaces.test.js"></script>
+  <script type="module" src="username.test.js"></script>
   <script type="module" src="app-group.test.js"></script>
   <script type="module" src="application.test.js"></script>
   <script type="module" src="payload.test.js"></script>

packages/snjs/mocha/username.test.js

@@ -0,0 +1,12 @@
+chai.use(chaiAsPromised)
+const expect = chai.expect
+
+describe('private username', () => {
+  it('generates private username', async () => {
+    const username = 'myusername'
+
+    const result = await ComputePrivateUsername(new SNWebCrypto(), username)
+
+    expect(result).to.equal('9aae57db8dbb233291a49cb7b8ab902336ec785e04f3be70157b8c1669014d0d')
+  })
+})

packages/snjs/mocha/workspaces.test.js

@@ -1,25 +0,0 @@
-chai.use(chaiAsPromised)
-const expect = chai.expect
-import * as Factory from './lib/factory.js'
-
-describe('private workspaces', () => {
-  it('generates identifier', async () => {
-    const userphrase = 'myworkspaceuserphrase'
-    const name = 'myworkspacename'
-
-    const result = await ComputePrivateWorkspaceIdentifier(new SNWebCrypto(), userphrase, name)
-
-    expect(result).to.equal('5155c13a44f333790f6564fbcee0c35a16d26a8359dd77d67d8ecc6ad5d399bb')
-  })
-
-  it('application result matches direct function call', async () => {
-    const userphrase = 'myworkspaceuserphrase'
-    const name = 'myworkspacename'
-
-    const application = (await Factory.createAppContextWithRealCrypto()).application
-    const appResult = await application.computePrivateWorkspaceIdentifier(userphrase, name)
-    const directResult = await ComputePrivateWorkspaceIdentifier(new SNWebCrypto(), userphrase, name)
-
-    expect(appResult).to.equal(directResult)
-  })
-})

packages/snjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/snjs",
-  "version": "2.138.1",
+  "version": "2.139.0",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/ui-services/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.7.5](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/ui-services
+
+## [1.7.4](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+**Note:** Version bump only for package @standardnotes/ui-services
+
 ## [1.7.3](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/ui-services

packages/ui-services/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/ui-services",
-  "version": "1.7.3",
+  "version": "1.7.5",
   "engines": {
     "node": ">=16.0.0 <17.0.0"
   },

packages/web/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.73.0](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+### Features
+
+* replace private workspaces with private usernames ([#1783](https://github.com/standardnotes/app/issues/1783)) ([18c821d](https://github.com/standardnotes/app/commit/18c821d8eb51beb6f54211eb1d6eb454303044f5))
+
+## [3.72.4](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+### Bug Fixes
+
+* bidirectional linking indicator for files ([37abac2](https://github.com/standardnotes/app/commit/37abac2ec2c839b3af9324a83e36cbbc409d86a9))
+
+## [3.72.3](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
+
+### Bug Fixes
+
+* css variable fallback ([075d7f4](https://github.com/standardnotes/app/commit/075d7f444da13b380ed675ecfd89823f840e2d56))
+
 ## [3.72.2](https://github.com/standardnotes/app/compare/@standardnotes/[email protected]...@standardnotes/[email protected]) (2022-10-12)
 
 **Note:** Version bump only for package @standardnotes/web

packages/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@standardnotes/web",
-  "version": "3.72.2",
+  "version": "3.73.0",
   "license": "AGPL-3.0-or-later",
   "main": "dist/app.js",
   "author": "Standard Notes.",

packages/web/src/javascripts/Components/AccountMenu/AdvancedOptions.tsx

@@ -10,7 +10,7 @@ type Props = {
   application: WebApplication
   viewControllerManager: ViewControllerManager
   disabled?: boolean
-  onPrivateWorkspaceChange?: (isPrivate: boolean, identifier?: string) => void
+  onPrivateUsernameModeChange?: (isPrivate: boolean, identifier?: string) => void
   onStrictSignInChange?: (isStrictSignIn: boolean) => void
   children?: ReactNode
 }
@@ -19,54 +19,46 @@ const AdvancedOptions: FunctionComponent<Props> = ({
   viewControllerManager,
   application,
   disabled = false,
-  onPrivateWorkspaceChange,
+  onPrivateUsernameModeChange,
   onStrictSignInChange,
   children,
 }) => {
   const { server, setServer, enableServerOption, setEnableServerOption } = viewControllerManager.accountMenuController
   const [showAdvanced, setShowAdvanced] = useState(false)
 
-  const [isPrivateWorkspace, setIsPrivateWorkspace] = useState(false)
-  const [privateWorkspaceName, setPrivateWorkspaceName] = useState('')
-  const [privateWorkspaceUserphrase, setPrivateWorkspaceUserphrase] = useState('')
+  const [isPrivateUsername, setIsPrivateUsername] = useState(false)
+  const [privateUsername, setPrivateUsername] = useState('')
 
   const [isStrictSignin, setIsStrictSignin] = useState(false)
 
   useEffect(() => {
-    const recomputePrivateWorkspaceIdentifier = async () => {
-      const identifier = await application.computePrivateWorkspaceIdentifier(
-        privateWorkspaceName,
-        privateWorkspaceUserphrase,
-      )
+    const recomputePrivateUsername = async () => {
+      const identifier = await application.computePrivateUsername(privateUsername)
 
       if (!identifier) {
-        if (privateWorkspaceName?.length > 0 && privateWorkspaceUserphrase?.length > 0) {
-          application.alertService.alert('Unable to compute private workspace name.').catch(console.error)
+        if (privateUsername?.length > 0) {
+          application.alertService.alert('Unable to compute private username.').catch(console.error)
         }
         return
       }
-      onPrivateWorkspaceChange?.(true, identifier)
+      onPrivateUsernameModeChange?.(true, identifier)
     }
 
-    if (privateWorkspaceName && privateWorkspaceUserphrase) {
-      recomputePrivateWorkspaceIdentifier().catch(console.error)
+    if (privateUsername) {
+      recomputePrivateUsername().catch(console.error)
     }
-  }, [privateWorkspaceName, privateWorkspaceUserphrase, application, onPrivateWorkspaceChange])
+  }, [privateUsername, application, onPrivateUsernameModeChange])
 
   useEffect(() => {
-    onPrivateWorkspaceChange?.(isPrivateWorkspace)
-  }, [isPrivateWorkspace, onPrivateWorkspaceChange])
+    onPrivateUsernameModeChange?.(isPrivateUsername)
+  }, [isPrivateUsername, onPrivateUsernameModeChange])
 
-  const handleIsPrivateWorkspaceChange = useCallback(() => {
-    setIsPrivateWorkspace(!isPrivateWorkspace)
-  }, [isPrivateWorkspace])
+  const handleIsPrivateUsernameChange = useCallback(() => {
+    setIsPrivateUsername(!isPrivateUsername)
+  }, [isPrivateUsername])
 
-  const handlePrivateWorkspaceNameChange = useCallback((name: string) => {
-    setPrivateWorkspaceName(name)
-  }, [])
-
-  const handlePrivateWorkspaceUserphraseChange = useCallback((userphrase: string) => {
-    setPrivateWorkspaceUserphrase(userphrase)
+  const handlePrivateUsernameNameChange = useCallback((name: string) => {
+    setPrivateUsername(name)
   }, [])
 
   const handleServerOptionChange: ChangeEventHandler<HTMLInputElement> = useCallback(
@@ -114,35 +106,28 @@ const AdvancedOptions: FunctionComponent<Props> = ({
           <div className="mb-1 flex items-center justify-between">
             <Checkbox
               name="private-workspace"
-              label="Private workspace"
-              checked={isPrivateWorkspace}
+              label="Private username mode"
+              checked={isPrivateUsername}
               disabled={disabled}
-              onChange={handleIsPrivateWorkspaceChange}
+              onChange={handleIsPrivateUsernameChange}
             />
             <a href="https://standardnotes.com/help/80" target="_blank" rel="noopener noreferrer" title="Learn more">
               <Icon type="info" className="text-neutral" />
             </a>
           </div>
 
-          {isPrivateWorkspace && (
+          {isPrivateUsername && (
             <>
               <DecoratedInput
                 className={{ container: 'mb-2' }}
-                left={[<Icon type="server" className="text-neutral" />]}
+                left={[<Icon type="account-circle" className="text-neutral" />]}
                 type="text"
-                placeholder="Userphrase"
-                value={privateWorkspaceUserphrase}
-                onChange={handlePrivateWorkspaceUserphraseChange}
-                disabled={disabled}
-              />
-              <DecoratedInput
-                className={{ container: 'mb-2' }}
-                left={[<Icon type="folder" className="text-neutral" />]}
-                type="text"
-                placeholder="Name"
-                value={privateWorkspaceName}
-                onChange={handlePrivateWorkspaceNameChange}
+                placeholder="Username"
+                value={privateUsername}
+                onChange={handlePrivateUsernameNameChange}
                 disabled={disabled}
+                spellcheck={false}
+                autocomplete={false}
               />
             </>
           )}

packages/web/src/javascripts/Components/AccountMenu/CreateAccount.tsx

@@ -40,7 +40,7 @@ const CreateAccount: FunctionComponent<Props> = ({
 }) => {
   const emailInputRef = useRef<HTMLInputElement>(null)
   const passwordInputRef = useRef<HTMLInputElement>(null)
-  const [isPrivateWorkspace, setIsPrivateWorkspace] = useState(false)
+  const [isPrivateUsername, setIsPrivateUsername] = useState(false)
 
   useEffect(() => {
     if (emailInputRef.current) {
@@ -98,11 +98,11 @@ const CreateAccount: FunctionComponent<Props> = ({
     setPassword('')
   }, [setEmail, setMenuPane, setPassword])
 
-  const onPrivateWorkspaceChange = useCallback(
-    (isPrivateWorkspace: boolean, privateWorkspaceIdentifier?: string) => {
-      setIsPrivateWorkspace(isPrivateWorkspace)
-      if (isPrivateWorkspace && privateWorkspaceIdentifier) {
-        setEmail(privateWorkspaceIdentifier)
+  const onPrivateUsernameChange = useCallback(
+    (isPrivateUsername: boolean, privateUsernameIdentifier?: string) => {
+      setIsPrivateUsername(isPrivateUsername)
+      if (isPrivateUsername && privateUsernameIdentifier) {
+        setEmail(privateUsernameIdentifier)
       }
     },
     [setEmail],
@@ -123,7 +123,7 @@ const CreateAccount: FunctionComponent<Props> = ({
       <form onSubmit={handleRegisterFormSubmit} className="mb-1 px-3">
         <DecoratedInput
           className={{ container: 'mb-2' }}
-          disabled={isPrivateWorkspace}
+          disabled={isPrivateUsername}
           left={[<Icon type="email" className="text-neutral" />]}
           onChange={handleEmailChange}
           onKeyDown={handleKeyDown}
@@ -147,7 +147,7 @@ const CreateAccount: FunctionComponent<Props> = ({
       <AdvancedOptions
         application={application}
         viewControllerManager={viewControllerManager}
-        onPrivateWorkspaceChange={onPrivateWorkspaceChange}
+        onPrivateUsernameModeChange={onPrivateUsernameChange}
       />
     </>
   )

packages/web/src/javascripts/Components/AccountMenu/SignIn.tsx

@@ -29,7 +29,7 @@ const SignInPane: FunctionComponent<Props> = ({ application, viewControllerManag
   const [isStrictSignin, setIsStrictSignin] = useState(false)
   const [isSigningIn, setIsSigningIn] = useState(false)
   const [shouldMergeLocal, setShouldMergeLocal] = useState(true)
-  const [isPrivateWorkspace, setIsPrivateWorkspace] = useState(false)
+  const [isPrivateUsername, setIsPrivateUsername] = useState(false)
 
   const emailInputRef = useRef<HTMLInputElement>(null)
   const passwordInputRef = useRef<HTMLInputElement>(null)
@@ -100,11 +100,11 @@ const SignInPane: FunctionComponent<Props> = ({ application, viewControllerManag
       })
   }, [viewControllerManager, application, email, isEphemeral, isStrictSignin, password, shouldMergeLocal])
 
-  const onPrivateWorkspaceChange = useCallback(
-    (newIsPrivateWorkspace: boolean, privateWorkspaceIdentifier?: string) => {
-      setIsPrivateWorkspace(newIsPrivateWorkspace)
-      if (newIsPrivateWorkspace && privateWorkspaceIdentifier) {
-        setEmail(privateWorkspaceIdentifier)
+  const onPrivateUsernameChange = useCallback(
+    (newisPrivateUsername: boolean, privateUsernameIdentifier?: string) => {
+      setIsPrivateUsername(newisPrivateUsername)
+      if (newisPrivateUsername && privateUsernameIdentifier) {
+        setEmail(privateUsernameIdentifier)
       }
     },
     [setEmail],
@@ -161,7 +161,7 @@ const SignInPane: FunctionComponent<Props> = ({ application, viewControllerManag
           onChange={handleEmailChange}
           onFocus={resetInvalid}
           onKeyDown={handleKeyDown}
-          disabled={isSigningIn || isPrivateWorkspace}
+          disabled={isSigningIn || isPrivateUsername}
           ref={emailInputRef}
         />
         <DecoratedPasswordInput
@@ -206,7 +206,7 @@ const SignInPane: FunctionComponent<Props> = ({ application, viewControllerManag
         viewControllerManager={viewControllerManager}
         application={application}
         disabled={isSigningIn}
-        onPrivateWorkspaceChange={onPrivateWorkspaceChange}
+        onPrivateUsernameModeChange={onPrivateUsernameChange}
         onStrictSignInChange={handleStrictSigninChange}
       />
     </>

packages/web/src/javascripts/Components/ContentListView/NoteListItem.tsx

@@ -32,7 +32,7 @@ const NoteListItem: FunctionComponent<DisplayableListItemProps> = ({
   const editorForNote = application.componentManager.editorForNote(item as SNNote)
   const editorName = editorForNote?.name ?? PLAIN_EDITOR_NAME
   const [icon, tint] = application.iconsController.getIconAndTintForNoteType(editorForNote?.package_info.note_type)
-  const hasFiles = application.items.getSortedFilesForItem(item).length > 0
+  const hasFiles = application.items.getSortedFilesLinkingToItem(item).length > 0
 
   const openNoteContextMenu = (posX: number, posY: number) => {
     notesController.setContextMenuOpen(false)

packages/web/src/javascripts/Components/Icon/Icon.tsx

@@ -5,6 +5,7 @@ import * as icons from '@standardnotes/icons'
 export const ICONS = {
   'account-circle': icons.AccountCircleIcon,
   'arrow-left': icons.ArrowLeftIcon,
+  'arrow-right': icons.ArrowRightIcon,
   'arrows-sort-down': icons.ArrowsSortDownIcon,
   'arrows-sort-up': icons.ArrowsSortUpIcon,
   'attachment-file': icons.AttachmentFileIcon,

packages/web/src/javascripts/Components/Input/DecoratedInput.tsx

@@ -20,6 +20,7 @@ const DecoratedInput = forwardRef(
   (
     {
       autocomplete = false,
+      spellcheck = true,
       className,
       disabled = false,
       id,
@@ -68,6 +69,7 @@ const DecoratedInput = forwardRef(
           title={title}
           type={type}
           value={value}
+          spellCheck={spellcheck}
         />
 
         {right && (

packages/web/src/javascripts/Components/Input/DecoratedInputProps.ts

@@ -2,6 +2,7 @@ import { FocusEventHandler, KeyboardEventHandler, ReactNode } from 'react'
 
 export type DecoratedInputProps = {
   autocomplete?: boolean
+  spellcheck?: boolean
   className?: {
     container?: string
     input?: string

packages/web/src/javascripts/Components/LinkedItems/LinkedItemBubble.tsx

@@ -1,24 +1,26 @@
-import { LinkableItem, LinkingController } from '@/Controllers/LinkingController'
+import { ItemLink, LinkableItem, LinkingController } from '@/Controllers/LinkingController'
 import { classNames } from '@/Utils/ConcatenateClassNames'
 import { KeyboardKey } from '@standardnotes/ui-services'
 import { observer } from 'mobx-react-lite'
 import { KeyboardEventHandler, MouseEventHandler, useEffect, useRef, useState } from 'react'
+import { ContentType } from '@standardnotes/snjs'
 import Icon from '../Icon/Icon'
 
 type Props = {
-  item: LinkableItem
+  link: ItemLink
   getItemIcon: LinkingController['getLinkedItemIcon']
   getTitleForLinkedTag: LinkingController['getTitleForLinkedTag']
   activateItem: (item: LinkableItem) => Promise<void>
-  unlinkItem: (item: LinkableItem) => void
+  unlinkItem: LinkingController['unlinkItemFromSelectedItem']
   focusPreviousItem: () => void
   focusNextItem: () => void
   focusedId: string | undefined
   setFocusedId: (id: string) => void
+  isBidirectional: boolean
 }
 
 const LinkedItemBubble = ({
-  item,
+  link,
   getItemIcon,
   getTitleForLinkedTag,
   activateItem,
@@ -27,6 +29,7 @@ const LinkedItemBubble = ({
   focusNextItem,
   focusedId,
   setFocusedId,
+  isBidirectional,
 }: Props) => {
   const ref = useRef<HTMLButtonElement>(null)
 
@@ -36,8 +39,8 @@ const LinkedItemBubble = ({
   const [wasClicked, setWasClicked] = useState(false)
 
   const handleFocus = () => {
-    if (focusedId !== item.uuid) {
-      setFocusedId(item.uuid)
+    if (focusedId !== link.id) {
+      setFocusedId(link.id)
     }
     setShowUnlinkButton(true)
   }
@@ -50,7 +53,7 @@ const LinkedItemBubble = ({
   const onClick: MouseEventHandler = (event) => {
     if (wasClicked && event.target !== unlinkButtonRef.current) {
       setWasClicked(false)
-      void activateItem(item)
+      void activateItem(link.item)
     } else {
       setWasClicked(true)
     }
@@ -58,14 +61,14 @@ const LinkedItemBubble = ({
 
   const onUnlinkClick: MouseEventHandler = (event) => {
     event.stopPropagation()
-    unlinkItem(item)
+    unlinkItem(link)
   }
 
   const onKeyDown: KeyboardEventHandler = (event) => {
     switch (event.key) {
       case KeyboardKey.Backspace: {
         focusPreviousItem()
-        unlinkItem(item)
+        unlinkItem(link)
         break
       }
       case KeyboardKey.Left:
@@ -77,29 +80,34 @@ const LinkedItemBubble = ({
     }
   }
 
-  const [icon, iconClassName] = getItemIcon(item)
-  const tagTitle = getTitleForLinkedTag(item)
+  const [icon, iconClassName] = getItemIcon(link.item)
+  const tagTitle = getTitleForLinkedTag(link.item)
 
   useEffect(() => {
-    if (item.uuid === focusedId) {
+    if (link.id === focusedId) {
       ref.current?.focus()
     }
-  }, [focusedId, item.uuid])
+  }, [focusedId, link.id])
 
   return (
     <button
       ref={ref}
-      className="flex h-6 cursor-pointer items-center rounded border-0 bg-passive-4-opacity-variant py-2 pl-1 pr-2 text-xs text-text hover:bg-contrast focus:bg-contrast"
+      className="group flex h-6 cursor-pointer items-center rounded border-0 bg-passive-4-opacity-variant py-2 pl-1 pr-2 text-xs text-text hover:bg-contrast focus:bg-contrast"
       onFocus={handleFocus}
       onBlur={onBlur}
       onClick={onClick}
-      title={tagTitle ? tagTitle.longTitle : item.title}
+      title={tagTitle ? tagTitle.longTitle : link.item.title}
       onKeyDown={onKeyDown}
     >
       <Icon type={icon} className={classNames('mr-1 flex-shrink-0', iconClassName)} size="small" />
-      <span className="max-w-290px overflow-hidden overflow-ellipsis whitespace-nowrap">
+      <span className="max-w-290px flex items-center overflow-hidden overflow-ellipsis whitespace-nowrap">
         {tagTitle && <span className="text-passive-1">{tagTitle.titlePrefix}</span>}
-        {item.title}
+        <span className="flex items-center gap-1">
+          {link.relationWithSelectedItem === 'indirect' && link.item.content_type !== ContentType.Tag && (
+            <span className={!isBidirectional ? 'hidden group-focus:block' : ''}>Linked By:</span>
+          )}
+          {link.item.title}
+        </span>
       </span>
       {showUnlinkButton && (
         <a

packages/web/src/javascripts/Components/LinkedItems/LinkedItemBubblesContainer.tsx

@@ -1,11 +1,12 @@
 import { observer } from 'mobx-react-lite'
 import ItemLinkAutocompleteInput from './ItemLinkAutocompleteInput'
-import { LinkableItem, LinkingController } from '@/Controllers/LinkingController'
+import { ItemLink, LinkableItem, LinkingController } from '@/Controllers/LinkingController'
 import LinkedItemBubble from './LinkedItemBubble'
 import { useCallback, useState } from 'react'
 import { useResponsiveAppPane } from '../ResponsivePane/ResponsivePaneProvider'
 import { ElementIds } from '@/Constants/ElementIDs'
 import { classNames } from '@/Utils/ConcatenateClassNames'
+import { ContentType } from '@standardnotes/snjs'
 
 type Props = {
   linkingController: LinkingController
@@ -14,8 +15,9 @@ type Props = {
 const LinkedItemBubblesContainer = ({ linkingController }: Props) => {
   const { toggleAppPane } = useResponsiveAppPane()
   const {
-    allLinkedItems,
-    notesLinkingToItem,
+    allItemLinks,
+    notesLinkingToActiveItem,
+    filesLinkingToActiveItem,
     unlinkItemFromSelectedItem: unlinkItem,
     getTitleForLinkedTag,
     getLinkedItemIcon: getItemIcon,
@@ -23,7 +25,13 @@ const LinkedItemBubblesContainer = ({ linkingController }: Props) => {
   } = linkingController
 
   const [focusedId, setFocusedId] = useState<string>()
-  const focusableIds = allLinkedItems.map((item) => item.uuid).concat([ElementIds.ItemLinkAutocompleteInput])
+  const focusableIds = allItemLinks
+    .map((link) => link.id)
+    .concat(
+      notesLinkingToActiveItem.map((link) => link.id),
+      filesLinkingToActiveItem.map((link) => link.id),
+      [ElementIds.ItemLinkAutocompleteInput],
+    )
 
   const focusPreviousItem = useCallback(() => {
     const currentFocusedIndex = focusableIds.findIndex((id) => id === focusedId)
@@ -53,27 +61,42 @@ const LinkedItemBubblesContainer = ({ linkingController }: Props) => {
     [activateItem, toggleAppPane],
   )
 
+  const isItemBidirectionallyLinked = (link: ItemLink) => {
+    const existsInAllItemLinks = !!allItemLinks.find((item) => link.item.uuid === item.item.uuid)
+    const existsInNotesLinkingToItem = !!notesLinkingToActiveItem.find((item) => link.item.uuid === item.item.uuid)
+    const existsInFilesLinkingToItem = !!filesLinkingToActiveItem.find((item) => link.item.uuid === item.item.uuid)
+
+    return (
+      existsInAllItemLinks &&
+      (link.item.content_type === ContentType.Note ? existsInNotesLinkingToItem : existsInFilesLinkingToItem)
+    )
+  }
+
   return (
     <div
       className={classNames(
         'hidden min-w-80 max-w-full flex-wrap items-center gap-2 bg-transparent md:-mr-2 md:flex',
-        allLinkedItems.length || notesLinkingToItem.length ? 'mt-1' : 'mt-0.5',
+        allItemLinks.length || notesLinkingToActiveItem.length ? 'mt-1' : 'mt-0.5',
       )}
     >
-      {allLinkedItems.concat(notesLinkingToItem).map((item) => (
-        <LinkedItemBubble
-          item={item}
-          key={item.uuid}
-          getItemIcon={getItemIcon}
-          getTitleForLinkedTag={getTitleForLinkedTag}
-          activateItem={activateItemAndTogglePane}
-          unlinkItem={unlinkItem}
-          focusPreviousItem={focusPreviousItem}
-          focusNextItem={focusNextItem}
-          focusedId={focusedId}
-          setFocusedId={setFocusedId}
-        />
-      ))}
+      {allItemLinks
+        .concat(notesLinkingToActiveItem)
+        .concat(filesLinkingToActiveItem)
+        .map((link) => (
+          <LinkedItemBubble
+            link={link}
+            key={link.id}
+            getItemIcon={getItemIcon}
+            getTitleForLinkedTag={getTitleForLinkedTag}
+            activateItem={activateItemAndTogglePane}
+            unlinkItem={unlinkItem}
+            focusPreviousItem={focusPreviousItem}
+            focusNextItem={focusNextItem}
+            focusedId={focusedId}
+            setFocusedId={setFocusedId}
+            isBidirectional={isItemBidirectionallyLinked(link)}
+          />
+        ))}
       <ItemLinkAutocompleteInput
         focusedId={focusedId}
         linkingController={linkingController}

packages/web/src/javascripts/Components/LinkedItems/LinkedItemsPanel.tsx

@@ -33,7 +33,7 @@ const LinkedItemsSectionItem = ({
   getTitleForLinkedTag: LinkingController['getTitleForLinkedTag']
   item: LinkableItem
   searchQuery?: string
-  unlinkItem: LinkingController['unlinkItemFromSelectedItem']
+  unlinkItem: () => void
   handleFileAction: FilesController['handleFileAction']
 }) => {
   const menuButtonRef = useRef<HTMLButtonElement>(null)
@@ -85,7 +85,7 @@ const LinkedItemsSectionItem = ({
         </div>
       ) : (
         <button
-          className="flex flex-grow items-center justify-between gap-4 py-2 pl-3 pr-12 text-sm hover:bg-info-backdrop focus:bg-info-backdrop"
+          className="flex max-w-full flex-grow items-center justify-between gap-4 py-2 pl-3 pr-12 text-sm hover:bg-info-backdrop focus:bg-info-backdrop"
           onClick={() => activateItem(item)}
           onContextMenu={(event) => {
             event.preventDefault()
@@ -118,7 +118,7 @@ const LinkedItemsSectionItem = ({
         <MenuItem
           type={MenuItemType.IconButton}
           onClick={() => {
-            unlinkItem(item)
+            unlinkItem()
             toggleMenu()
           }}
         >
@@ -166,10 +166,11 @@ const LinkedItemsPanel = ({
 }) => {
   const {
     tags,
-    files,
+    linkedFiles,
+    filesLinkingToActiveItem,
     notesLinkedToItem,
-    notesLinkingToItem,
-    allLinkedItems,
+    notesLinkingToActiveItem,
+    allItemLinks: allLinkedItems,
     getTitleForLinkedTag,
     getLinkedItemIcon,
     getSearchResults,
@@ -196,7 +197,7 @@ const LinkedItemsPanel = ({
       <form
         className={classNames(
           'sticky top-0 z-10 bg-default px-2.5 pt-2.5',
-          allLinkedItems.length || linkedResults.length || unlinkedResults.length || notesLinkingToItem.length
+          allLinkedItems.length || linkedResults.length || unlinkedResults.length || notesLinkingToActiveItem.length
             ? 'border-b border-border pb-2.5'
             : 'pb-1',
         )}
@@ -246,14 +247,14 @@ const LinkedItemsPanel = ({
               <div>
                 <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">Linked</div>
                 <div className="my-1">
-                  {linkedResults.map((item) => (
+                  {linkedResults.map((link) => (
                     <LinkedItemsSectionItem
-                      key={item.uuid}
-                      item={item}
+                      key={link.id}
+                      item={link.item}
                       getItemIcon={getLinkedItemIcon}
                       getTitleForLinkedTag={getTitleForLinkedTag}
                       searchQuery={searchQuery}
-                      unlinkItem={unlinkItemFromSelectedItem}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
                       activateItem={activateItem}
                       handleFileAction={filesController.handleFileAction}
                     />
@@ -268,14 +269,14 @@ const LinkedItemsPanel = ({
               <div>
                 <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">Linked Tags</div>
                 <div className="my-1">
-                  {tags.map((item) => (
+                  {tags.map((link) => (
                     <LinkedItemsSectionItem
-                      key={item.uuid}
-                      item={item}
+                      key={link.id}
+                      item={link.item}
                       getItemIcon={getLinkedItemIcon}
                       getTitleForLinkedTag={getTitleForLinkedTag}
                       searchQuery={searchQuery}
-                      unlinkItem={unlinkItemFromSelectedItem}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
                       activateItem={activateItem}
                       handleFileAction={filesController.handleFileAction}
                     />
@@ -283,18 +284,39 @@ const LinkedItemsPanel = ({
                 </div>
               </div>
             )}
-            {!!files.length && (
+            {!!linkedFiles.length && (
               <div>
                 <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">Linked Files</div>
                 <div className="my-1">
-                  {files.map((item) => (
+                  {linkedFiles.map((link) => (
                     <LinkedItemsSectionItem
-                      key={item.uuid}
-                      item={item}
+                      key={link.id}
+                      item={link.item}
                       getItemIcon={getLinkedItemIcon}
                       getTitleForLinkedTag={getTitleForLinkedTag}
                       searchQuery={searchQuery}
-                      unlinkItem={unlinkItemFromSelectedItem}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
+                      activateItem={activateItem}
+                      handleFileAction={filesController.handleFileAction}
+                    />
+                  ))}
+                </div>
+              </div>
+            )}
+            {!!filesLinkingToActiveItem.length && (
+              <div>
+                <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">
+                  Files Linking To Current File
+                </div>
+                <div className="my-1">
+                  {filesLinkingToActiveItem.map((link) => (
+                    <LinkedItemsSectionItem
+                      key={link.id}
+                      item={link.item}
+                      getItemIcon={getLinkedItemIcon}
+                      getTitleForLinkedTag={getTitleForLinkedTag}
+                      searchQuery={searchQuery}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
                       activateItem={activateItem}
                       handleFileAction={filesController.handleFileAction}
                     />
@@ -306,14 +328,14 @@ const LinkedItemsPanel = ({
               <div>
                 <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">Linked Notes</div>
                 <div className="my-1">
-                  {notesLinkedToItem.map((item) => (
+                  {notesLinkedToItem.map((link) => (
                     <LinkedItemsSectionItem
-                      key={item.uuid}
-                      item={item}
+                      key={link.id}
+                      item={link.item}
                       getItemIcon={getLinkedItemIcon}
                       getTitleForLinkedTag={getTitleForLinkedTag}
                       searchQuery={searchQuery}
-                      unlinkItem={unlinkItemFromSelectedItem}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
                       activateItem={activateItem}
                       handleFileAction={filesController.handleFileAction}
                     />
@@ -321,20 +343,20 @@ const LinkedItemsPanel = ({
                 </div>
               </div>
             )}
-            {!!notesLinkingToItem.length && (
+            {!!notesLinkingToActiveItem.length && (
               <div>
                 <div className="mt-3 mb-1 px-3 text-menu-item font-semibold uppercase text-passive-0">
                   Notes Linking To This Note
                 </div>
                 <div className="my-1">
-                  {notesLinkingToItem.map((item) => (
+                  {notesLinkingToActiveItem.map((link) => (
                     <LinkedItemsSectionItem
-                      key={item.uuid}
-                      item={item}
+                      key={link.id}
+                      item={link.item}
                       getItemIcon={getLinkedItemIcon}
                       getTitleForLinkedTag={getTitleForLinkedTag}
                       searchQuery={searchQuery}
-                      unlinkItem={unlinkItemFromSelectedItem}
+                      unlinkItem={() => unlinkItemFromSelectedItem(link)}
                       activateItem={activateItem}
                       handleFileAction={filesController.handleFileAction}
                     />

packages/web/src/javascripts/Controllers/FilesController.ts

@@ -99,7 +99,7 @@ export class FilesController extends AbstractViewController {
   reloadAttachedFiles = () => {
     const note = this.notesController.firstSelectedNote
     if (note) {
-      this.attachedFiles = this.application.items.getSortedFilesForItem(note)
+      this.attachedFiles = this.application.items.getSortedFilesLinkingToItem(note)
     }
   }
 

packages/web/src/javascripts/Controllers/LinkingController.tsx

@@ -10,7 +10,9 @@ import {
   IconType,
   InternalEventBus,
   ItemContent,
+  ItemsClientInterface,
   naturalSort,
+  NoteViewController,
   PrefKey,
   SNNote,
   SNTag,
@@ -25,11 +27,20 @@ import { SubscriptionController } from './Subscription/SubscriptionController'
 
 export type LinkableItem = DecryptedItemInterface<ItemContent>
 
+type RelationWithSelectedItem = ReturnType<ItemsClientInterface['relationshipTypeForItems']>
+
+export type ItemLink<ItemType extends LinkableItem = LinkableItem> = {
+  id: string
+  item: ItemType
+  relationWithSelectedItem: RelationWithSelectedItem
+}
+
 export class LinkingController extends AbstractViewController {
-  tags: SNTag[] = []
-  files: FileItem[] = []
-  notesLinkedToItem: SNNote[] = []
-  notesLinkingToItem: SNNote[] = []
+  tags: ItemLink<SNTag>[] = []
+  linkedFiles: ItemLink<FileItem>[] = []
+  filesLinkingToActiveItem: ItemLink<FileItem>[] = []
+  notesLinkedToItem: ItemLink<SNNote>[] = []
+  notesLinkingToActiveItem: ItemLink<SNNote>[] = []
   shouldLinkToParentFolders: boolean
   isLinkingPanelOpen = false
   private itemListController!: ItemListController
@@ -46,13 +57,15 @@ export class LinkingController extends AbstractViewController {
 
     makeObservable(this, {
       tags: observable,
-      files: observable,
+      linkedFiles: observable,
+      filesLinkingToActiveItem: observable,
       notesLinkedToItem: observable,
-      notesLinkingToItem: observable,
+      notesLinkingToActiveItem: observable,
       isLinkingPanelOpen: observable,
 
-      allLinkedItems: computed,
+      allItemLinks: computed,
       isEntitledToNoteLinking: computed,
+      selectedItemTitle: computed,
 
       setIsLinkingPanelOpen: action,
       reloadLinkedFiles: action,
@@ -107,14 +120,22 @@ export class LinkingController extends AbstractViewController {
     this.isLinkingPanelOpen = open
   }
 
-  get allLinkedItems() {
-    return [...this.tags, ...this.files, ...this.notesLinkedToItem]
+  get allItemLinks() {
+    return [...this.tags, ...this.linkedFiles, ...this.notesLinkedToItem]
   }
 
   get activeItem() {
     return this.itemListController.activeControllerItem
   }
 
+  get selectedItemTitle() {
+    return this.selectionController.firstSelectedItem
+      ? this.selectionController.firstSelectedItem.title
+      : this.activeItem
+      ? this.activeItem.title
+      : ''
+  }
+
   reloadAllLinks() {
     this.reloadLinkedFiles()
     this.reloadLinkedTags()
@@ -122,31 +143,67 @@ export class LinkingController extends AbstractViewController {
     this.reloadNotesLinkingToItem()
   }
 
+  createLinkFromItem = <ItemType extends LinkableItem = LinkableItem>(
+    item: ItemType,
+    relation?: RelationWithSelectedItem,
+  ): ItemLink<ItemType> => {
+    const relationWithSelectedItem = relation ? relation : this.itemRelationshipWithSelectedItem(item)
+
+    return {
+      id: `${item.uuid}-${relationWithSelectedItem}`,
+      item,
+      relationWithSelectedItem,
+    }
+  }
+
   reloadLinkedFiles() {
-    if (this.activeItem) {
-      const files = this.application.items.getSortedFilesForItem(this.activeItem)
-      this.files = files
+    if (!this.activeItem) {
+      return
+    }
+
+    const isActiveItemAFile = this.activeItem instanceof FileItem
+
+    const linkedFiles = this.application.items
+      .getSortedLinkedFilesForItem(this.activeItem)
+      .map((item) => this.createLinkFromItem(item, isActiveItemAFile ? 'direct' : 'indirect'))
+
+    const filesLinkingToActiveItem = this.application.items
+      .getSortedFilesLinkingToItem(this.activeItem)
+      .map((item) => this.createLinkFromItem(item, isActiveItemAFile ? 'indirect' : 'direct'))
+
+    if (isActiveItemAFile) {
+      this.linkedFiles = linkedFiles
+      this.filesLinkingToActiveItem = filesLinkingToActiveItem
+    } else {
+      this.linkedFiles = filesLinkingToActiveItem
+      this.filesLinkingToActiveItem = linkedFiles
     }
   }
 
   reloadLinkedTags() {
     if (this.activeItem) {
-      const tags = this.application.items.getSortedTagsForItem(this.activeItem)
+      const tags = this.application.items
+        .getSortedTagsForItem(this.activeItem)
+        .map((item) => this.createLinkFromItem(item))
       this.tags = tags
     }
   }
 
   reloadLinkedNotes() {
     if (this.activeItem) {
-      const notes = this.application.items.getSortedLinkedNotesForItem(this.activeItem)
+      const notes = this.application.items
+        .getSortedLinkedNotesForItem(this.activeItem)
+        .map((item) => this.createLinkFromItem(item, 'direct'))
       this.notesLinkedToItem = notes
     }
   }
 
   reloadNotesLinkingToItem() {
     if (this.activeItem) {
-      const notes = this.application.items.getSortedNotesLinkingToItem(this.activeItem)
-      this.notesLinkingToItem = notes
+      const notes = this.application.items
+        .getSortedNotesLinkingToItem(this.activeItem)
+        .map((item) => this.createLinkFromItem(item, 'indirect'))
+      this.notesLinkingToActiveItem = notes
     }
   }
 
@@ -206,44 +263,61 @@ export class LinkingController extends AbstractViewController {
     return undefined
   }
 
-  unlinkItemFromSelectedItem = async (itemToUnlink: LinkableItem) => {
+  itemRelationshipWithSelectedItem = (item: LinkableItem) => {
+    const activeItem = this.activeItem
+
+    if (!activeItem) {
+      throw new Error('No active item available')
+    }
+
+    return this.application.items.relationshipTypeForItems(activeItem, item)
+  }
+
+  unlinkItemFromSelectedItem = async (itemToUnlink: ItemLink) => {
     const selectedItem = this.selectionController.firstSelectedItem
 
     if (!selectedItem) {
       return
     }
 
-    const selectedItemReferencesItemToUnlink =
-      this.application.items.relationshipTypeForItems(selectedItem, itemToUnlink) === 'direct'
+    const selectedItemReferencesItemToUnlink = itemToUnlink.relationWithSelectedItem === 'direct'
 
     if (selectedItemReferencesItemToUnlink) {
-      await this.application.items.unlinkItem(selectedItem, itemToUnlink)
+      await this.application.items.unlinkItem(selectedItem, itemToUnlink.item)
     } else {
-      await this.application.items.unlinkItem(itemToUnlink, selectedItem)
+      await this.application.items.unlinkItem(itemToUnlink.item, selectedItem)
     }
 
     void this.application.sync.sync()
     this.reloadAllLinks()
   }
 
-  linkItemToSelectedItem = async (itemToLink: LinkableItem) => {
-    const selectedItem = this.selectionController.firstSelectedItem
+  ensureActiveItemIsInserted = async () => {
+    const activeItemController = this.itemListController.getActiveItemController()
+    if (activeItemController instanceof NoteViewController && activeItemController.isTemplateNote) {
+      await activeItemController.insertTemplatedNote()
+    }
+  }
 
-    if (itemToLink instanceof SNTag) {
-      await this.addTagToActiveItem(itemToLink)
+  linkItemToSelectedItem = async (itemToLink: LinkableItem) => {
+    await this.ensureActiveItemIsInserted()
+    const activeItem = this.activeItem
+
+    if (activeItem && itemToLink instanceof SNTag) {
+      await this.addTagToItem(itemToLink, activeItem)
     }
 
-    if (selectedItem instanceof SNNote) {
+    if (activeItem instanceof SNNote) {
       if (itemToLink instanceof FileItem) {
-        await this.application.items.associateFileWithNote(itemToLink, selectedItem)
+        await this.application.items.associateFileWithNote(itemToLink, activeItem)
       } else if (itemToLink instanceof SNNote && this.isEntitledToNoteLinking) {
-        await this.application.items.linkNoteToNote(selectedItem, itemToLink)
+        await this.application.items.linkNoteToNote(activeItem, itemToLink)
       }
-    } else if (selectedItem instanceof FileItem) {
+    } else if (activeItem instanceof FileItem) {
       if (itemToLink instanceof SNNote) {
-        await this.application.items.associateFileWithNote(selectedItem, itemToLink)
+        await this.application.items.associateFileWithNote(activeItem, itemToLink)
       } else if (itemToLink instanceof FileItem) {
-        await this.application.items.linkFileToFile(itemToLink, selectedItem)
+        await this.application.items.linkFileToFile(activeItem, itemToLink)
       }
     }
 
@@ -252,21 +326,19 @@ export class LinkingController extends AbstractViewController {
   }
 
   createAndAddNewTag = async (title: string) => {
+    await this.ensureActiveItemIsInserted()
+    const activeItem = this.activeItem
     const newTag = await this.application.mutator.findOrCreateTag(title)
-    await this.addTagToActiveItem(newTag)
+    if (activeItem) {
+      await this.addTagToItem(newTag, activeItem)
+    }
   }
 
-  addTagToActiveItem = async (tag: SNTag) => {
-    const activeItem = this.itemListController.activeControllerItem
-
-    if (!activeItem) {
-      return
-    }
-
-    if (activeItem instanceof SNNote) {
-      await this.application.items.addTagToNote(activeItem, tag, this.shouldLinkToParentFolders)
-    } else if (activeItem instanceof FileItem) {
-      await this.application.items.addTagToFile(activeItem, tag, this.shouldLinkToParentFolders)
+  addTagToItem = async (tag: SNTag, item: FileItem | SNNote) => {
+    if (item instanceof SNNote) {
+      await this.application.items.addTagToNote(item, tag, this.shouldLinkToParentFolders)
+    } else if (item instanceof FileItem) {
+      await this.application.items.addTagToFile(item, tag, this.shouldLinkToParentFolders)
     }
 
     this.reloadLinkedTags()
@@ -293,19 +365,23 @@ export class LinkingController extends AbstractViewController {
       'title',
     )
 
-    const isAlreadyLinked = (item: LinkableItem) => {
+    const isAlreadyLinked = (item: DecryptedItemInterface<ItemContent>) => {
       if (!this.activeItem) {
         return false
       }
+
       const isItemReferencedByActiveItem = this.application.items
         .itemsReferencingItem(item)
         .some((linkedItem) => linkedItem.uuid === this.activeItem?.uuid)
       const isActiveItemReferencedByItem = this.application.items
         .itemsReferencingItem(this.activeItem)
         .some((linkedItem) => linkedItem.uuid === item.uuid)
-      const isAlreadyLinkedToItem =
-        isItemReferencedByActiveItem || (item.content_type !== ContentType.Note && isActiveItemReferencedByItem)
-      return isAlreadyLinkedToItem
+
+      if (this.activeItem.content_type === item.content_type) {
+        return isItemReferencedByActiveItem
+      }
+
+      return isActiveItemReferencedByItem || isItemReferencedByActiveItem
     }
 
     const prioritizeTagResult = (
@@ -325,10 +401,14 @@ export class LinkingController extends AbstractViewController {
       .slice(0, 20)
       .filter((item) => !isAlreadyLinked(item))
       .sort(prioritizeTagResult)
-    const linkedResults = searchResults.filter(isAlreadyLinked).slice(0, 20)
-    const isResultExistingTag = (result: LinkableItem) =>
+    const linkedResults = searchResults
+      .filter(isAlreadyLinked)
+      .slice(0, 20)
+      .map((item) => this.createLinkFromItem(item))
+    const isResultExistingTag = (result: DecryptedItemInterface<ItemContent>) =>
       result.content_type === ContentType.Tag && result.title === searchQuery
-    const shouldShowCreateTag = !linkedResults.find(isResultExistingTag) && !unlinkedResults.find(isResultExistingTag)
+    const shouldShowCreateTag =
+      !linkedResults.find((link) => isResultExistingTag(link.item)) && !unlinkedResults.find(isResultExistingTag)
 
     return {
       unlinkedResults,

packages/web/src/stylesheets/_main.scss

@@ -163,7 +163,7 @@ $footer-height: 2rem;
   width: 100%;
 
   @media screen and (min-width: 768px) {
-    height: calc(var(--viewport-height) - #{$footer-height});
+    height: calc(var(--viewport-height, 100vh) - #{$footer-height});
   }
 
   .section {

packages/web/tailwind.config.js

@@ -47,16 +47,16 @@ module.exports = {
         125: '31.25rem',
       },
       height: {
-        screen: 'var(--viewport-height)',
+        screen: 'var(--viewport-height, 100vh)',
       },
       minHeight: {
         1: '0.25rem',
         2: '0.5rem',
-        screen: 'var(--viewport-height)',
+        screen: 'var(--viewport-height, 100vh)',
       },
       maxHeight: {
         110: '27.5rem',
-        screen: 'var(--viewport-height)',
+        screen: 'var(--viewport-height, 100vh)',
       },
       zIndex: {
         'editor-content': 'var(--z-index-editor-content)',