Merge branch 'release/2019-09-18'

.eslintrc.js

@@ -50,7 +50,7 @@ module.exports = {
     '@typescript-eslint/no-parameter-properties': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
-    '@typescript-eslint/array-type': ['error', 'array-simple'],
+    '@typescript-eslint/array-type': ['error', { default: 'array-simple', readonly: 'array-simple' }],
     'no-unused-expressions': ['error', { allowShortCircuit: true, allowTernary: true }],
     'prettier/prettier': 'error',
     'require-jsdoc': 1,
@@ -89,7 +89,6 @@ module.exports = {
       rules: {
         '@typescript-eslint/no-explicit-any': 'off',
         '@typescript-eslint/no-non-null-assertion': 'off',
-        '@typescript-eslint/no-object-literal-type-assertion': 'off',
         'dot-notation': 'off',
       },
     },

apps/sensenet/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sensenet/sn-app",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "main": "dist/index.js",
   "files": [
     "dist",
@@ -27,18 +27,18 @@
   "homepage": "https://sensenet.com",
   "devDependencies": {
     "@types/autosuggest-highlight": "^3.1.0",
-    "@types/react": "^16.8.23",
-    "@types/react-autosuggest": "^9.3.8",
-    "@types/react-dom": "^16.8.5",
-    "@types/react-redux": "^7.1.1",
+    "@types/react": "^16.9.2",
+    "@types/react-autosuggest": "^9.3.10",
+    "@types/react-dom": "^16.9.0",
+    "@types/react-redux": "^7.1.2",
     "@types/react-responsive": "^3.0.3",
     "@types/react-router": "^5.0.3",
-    "@types/react-router-dom": "^4.3.3",
+    "@types/react-router-dom": "^4.3.5",
     "@types/uuid": "^3.4.5",
     "autoprefixer": "^9.6.1",
     "awesome-typescript-loader": "^5.2.1",
-    "css-loader": "^3.1.0",
-    "file-loader": "^4.1.0",
+    "css-loader": "^3.2.0",
+    "file-loader": "^4.2.0",
     "git-revision-webpack-plugin": "^3.0.3",
     "html-webpack-plugin": "^3.2.0",
     "monaco-editor-webpack-plugin": "^1.7.0",
@@ -47,46 +47,47 @@
     "react-router": "^5.0.0",
     "react-router-dom": "^5.0.0",
     "source-map-loader": "^0.2.4",
-    "style-loader": "^0.23.1",
+    "style-loader": "^1.0.0",
     "ts-config-webpack-plugin": "^1.4.0",
     "url-loader": "^2.1.0",
-    "webpack": "^4.38.0",
+    "webpack": "^4.39.2",
     "webpack-bundle-analyzer": "^3.4.1",
-    "webpack-cli": "^3.3.6",
-    "webpack-dev-server": "^3.4.1"
+    "webpack-cli": "^3.3.7",
+    "webpack-dev-server": "^3.8.0"
   },
   "dependencies": {
     "@furystack/inject": "^4.0.2",
-    "@furystack/logging": "^2.0.2",
-    "@material-ui/core": "^4.3.1",
+    "@furystack/logging": "^2.0.3",
+    "@material-ui/core": "^4.3.3",
     "@material-ui/icons": "^4.0.1",
-    "@sensenet/authentication-google": "^2.0.11",
-    "@sensenet/authentication-jwt": "^1.0.15",
-    "@sensenet/client-core": "^2.2.0",
-    "@sensenet/client-utils": "^1.6.4",
-    "@sensenet/controls-react": "^3.1.0",
-    "@sensenet/default-content-types": "^2.0.0",
-    "@sensenet/document-viewer-react": "^1.2.0",
-    "@sensenet/icons-react": "^1.2.12",
-    "@sensenet/list-controls-react": "^1.3.10",
-    "@sensenet/pickers-react": "^1.2.3",
-    "@sensenet/query": "^1.1.8",
-    "@sensenet/redux": "^5.1.12",
-    "@sensenet/repository-events": "^1.4.4",
+    "@sensenet/authentication-google": "^2.0.12",
+    "@sensenet/authentication-jwt": "^1.0.16",
+    "@sensenet/client-core": "^2.2.1",
+    "@sensenet/client-utils": "^1.6.5",
+    "@sensenet/controls-react": "^3.1.1",
+    "@sensenet/default-content-types": "^2.0.1",
+    "@sensenet/document-viewer-react": "^1.2.1",
+    "@sensenet/hooks-react": "^1.0.0",
+    "@sensenet/icons-react": "^1.2.13",
+    "@sensenet/list-controls-react": "^1.3.11",
+    "@sensenet/pickers-react": "^1.2.4",
+    "@sensenet/query": "^1.1.9",
+    "@sensenet/redux": "^5.1.13",
+    "@sensenet/repository-events": "^1.4.5",
     "autosuggest-highlight": "^3.1.1",
     "moment": "^2.24.0",
     "monaco-editor": "^0.17.0",
-    "react": "^16.8.2",
+    "react": "^16.9.0",
     "react-autosuggest": "^9.4.3",
-    "react-dom": "^16.8.2",
+    "react-dom": "^16.9.0",
     "react-markdown": "^4.0.8",
-    "react-monaco-editor": "^0.28.0",
+    "react-monaco-editor": "^0.30.1",
     "react-redux": "^7.0.3",
     "react-responsive": "^7.0.0",
     "redux": "^4.0.4",
     "redux-di-middleware": "^4.0.1",
     "semaphore-async-await": "^1.5.1",
-    "uuid": "^3.3.2"
+    "uuid": "^3.3.3"
   },
   "typings": "./dist/index.d.ts"
 }

apps/sensenet/src/components/AddButton.tsx

@@ -9,8 +9,8 @@ import { GenericContent, Schema } from '@sensenet/default-content-types'
 import React, { useContext, useEffect, useState } from 'react'
 import { UploadProgressInfo } from '@sensenet/client-core'
 import { ObservableValue } from '@sensenet/client-utils'
-import { CurrentContentContext } from '../context'
-import { useInjector, useLocalization, useLogger, useRepository } from '../hooks'
+import { CurrentContentContext, useInjector, useLogger, useRepository } from '@sensenet/hooks-react'
+import { useLocalization } from '../hooks'
 import { UploadTracker } from '../services/UploadTracker'
 import { AddDialog } from './dialogs/add'
 import { Icon } from './Icon'

apps/sensenet/src/components/Breadcrumbs.tsx

@@ -1,38 +1,39 @@
 import Button from '@material-ui/core/Button'
 import Tooltip from '@material-ui/core/Tooltip'
-import Typography from '@material-ui/core/Typography'
-import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight'
+import Breadcrumbs from '@material-ui/core/Breadcrumbs'
 import { GenericContent } from '@sensenet/default-content-types'
 import React, { useState } from 'react'
 import { RouteComponentProps, withRouter } from 'react-router'
-import { CurrentContentContext } from '../context'
+import { CurrentContentContext } from '@sensenet/hooks-react'
 import { ContentContextMenu } from './ContentContextMenu'
 import { DropFileArea } from './DropFileArea'
 import { Icon } from './Icon'
 
-export interface BreadcrumbItem {
+export interface BreadcrumbItem<T extends GenericContent> {
   url: string
   displayName: string
   title: string
-  content: GenericContent
+  content: T
 }
 
-export interface BreadcrumbProps {
-  content: BreadcrumbItem[]
-  currentContent: BreadcrumbItem
-  onItemClick: (event: React.MouseEvent, item: BreadcrumbItem) => void
+export interface BreadcrumbProps<T extends GenericContent> {
+  items: Array<BreadcrumbItem<T>>
+  onItemClick: (event: React.MouseEvent, item: BreadcrumbItem<T>) => void
 }
 
-const Breadcrumbs: React.FunctionComponent<BreadcrumbProps & RouteComponentProps> = props => {
+/**
+ * Represents a breadcrumb component
+ */
+function BreadcrumbsComponent<T extends GenericContent>(props: BreadcrumbProps<T> & RouteComponentProps) {
   const [contextMenuItem, setContextMenuItem] = useState<GenericContent | null>(null)
   const [contextMenuAnchor, setContextMenuAnchor] = useState<HTMLElement | null>(null)
   const [isContextMenuOpened, setIsContextMenuOpened] = useState(false)
 
   return (
     <>
-      <Typography variant="h5" style={{ padding: '.5em' }}>
-        {props.content.map((item, key) => (
-          <DropFileArea key={key} parentContent={item.content} style={{ display: 'inline-block' }}>
+      <Breadcrumbs maxItems={5} aria-label="breadcrumb">
+        {props.items.map(item => (
+          <DropFileArea key={item.content.Id} parentContent={item.content} style={{ display: 'inline-block' }}>
             <Tooltip title={item.title}>
               <Button
                 onClick={ev => props.onItemClick(ev, item)}
@@ -46,25 +47,9 @@ const Breadcrumbs: React.FunctionComponent<BreadcrumbProps & RouteComponentProps
                 {item.displayName}
               </Button>
             </Tooltip>
-            <KeyboardArrowRight style={{ verticalAlign: 'middle', height: '16px' }} />
           </DropFileArea>
         ))}
-        <DropFileArea parentContent={props.currentContent.content} style={{ display: 'inline-block' }}>
-          <Tooltip title={props.currentContent.content.Path || '/'}>
-            <Button
-              onClick={ev => props.onItemClick(ev, props.currentContent)}
-              onContextMenu={ev => {
-                setContextMenuItem(props.currentContent.content)
-                setContextMenuAnchor(ev.currentTarget)
-                setIsContextMenuOpened(true)
-                ev.preventDefault()
-              }}>
-              <Icon item={props.currentContent.content} style={{ marginRight: '0.3em' }} />
-              {props.currentContent.displayName}
-            </Button>
-          </Tooltip>
-        </DropFileArea>
-      </Typography>
+      </Breadcrumbs>
       {contextMenuItem ? (
         <CurrentContentContext.Provider value={contextMenuItem}>
           <ContentContextMenu
@@ -84,6 +69,6 @@ const Breadcrumbs: React.FunctionComponent<BreadcrumbProps & RouteComponentProps
   )
 }
 
-const routed = withRouter(Breadcrumbs)
+const routed = withRouter(BreadcrumbsComponent)
 
 export default routed

apps/sensenet/src/components/ContentBreadcrumbs.tsx

@@ -1,30 +1,33 @@
 import React, { useContext } from 'react'
 import { RouteComponentProps, withRouter } from 'react-router'
-import { CurrentAncestorsContext, CurrentContentContext } from '../context'
+import { CurrentAncestorsContext, CurrentContentContext } from '@sensenet/hooks-react'
+import { GenericContent } from '@sensenet/default-content-types'
 import { useContentRouting } from '../hooks'
 import Breadcrumbs, { BreadcrumbItem } from './Breadcrumbs'
 
 export const ContentBreadcrumbsComponent: React.FunctionComponent<
-  RouteComponentProps & { onItemClick?: (item: BreadcrumbItem) => void }
+  RouteComponentProps & { onItemClick?: (item: BreadcrumbItem<GenericContent>) => void }
 > = props => {
   const ancestors = useContext(CurrentAncestorsContext)
   const parent = useContext(CurrentContentContext)
   const contentRouter = useContentRouting()
 
   return (
     <Breadcrumbs
-      content={ancestors.map(content => ({
-        displayName: content.DisplayName || content.Name,
-        title: content.Path,
-        url: contentRouter.getPrimaryActionUrl(content),
-        content,
-      }))}
-      currentContent={{
-        displayName: parent.DisplayName || parent.Name,
-        title: parent.Path,
-        url: contentRouter.getPrimaryActionUrl(parent),
-        content: parent,
-      }}
+      items={[
+        ...ancestors.map(content => ({
+          displayName: content.DisplayName || content.Name,
+          title: content.Path,
+          url: contentRouter.getPrimaryActionUrl(content),
+          content,
+        })),
+        {
+          displayName: parent.DisplayName || parent.Name,
+          title: parent.Path,
+          url: contentRouter.getPrimaryActionUrl(parent),
+          content: parent,
+        },
+      ]}
       onItemClick={(_ev, item) => {
         props.onItemClick
           ? props.onItemClick(item)

apps/sensenet/src/components/ContentContextMenu.tsx

@@ -14,8 +14,15 @@ import Info from '@material-ui/icons/Info'
 import React, { useCallback, useContext, useState } from 'react'
 import { RouteComponentProps, withRouter } from 'react-router'
 import { ConstantContent } from '@sensenet/client-core'
-import { CurrentContentContext, CurrentContentProvider, ResponsiveContext } from '../context'
-import { useContentRouting, useDownload, useLocalization, useRepository, useWopi } from '../hooks'
+import {
+  CurrentContentContext,
+  CurrentContentProvider,
+  useDownload,
+  useRepository,
+  useWopi,
+} from '@sensenet/hooks-react'
+import { ResponsiveContext } from '../context'
+import { useContentRouting, useLocalization } from '../hooks'
 import { ContentInfoDialog, CopyMoveDialog, DeleteContentDialog, EditPropertiesDialog } from './dialogs'
 import { Icon } from './Icon'
 

apps/sensenet/src/components/DocViewer.tsx

@@ -3,8 +3,8 @@ import React, { useCallback, useEffect } from 'react'
 import { RouteComponentProps, withRouter } from 'react-router'
 import { Close } from '@material-ui/icons'
 import { Button } from '@material-ui/core'
-import { CurrentContentProvider } from '../context'
-import { useInjector, useLocalization, useRepository, useSelectionService, useTheme } from '../hooks'
+import { CurrentContentProvider, useInjector, useRepository } from '@sensenet/hooks-react'
+import { useLocalization, useSelectionService, useTheme } from '../hooks'
 import { getViewerSettings } from '../services/GetViewerSettings'
 
 const DocViewer: React.FunctionComponent<

apps/sensenet/src/components/DropFileArea.tsx

@@ -3,7 +3,8 @@ import { GenericContent } from '@sensenet/default-content-types'
 import React, { useEffect, useState } from 'react'
 import { UploadProgressInfo } from '@sensenet/client-core'
 import { ObservableValue } from '@sensenet/client-utils'
-import { useInjector, useRepository, useTheme } from '../hooks'
+import { useInjector, useRepository } from '@sensenet/hooks-react'
+import { useTheme } from '../hooks'
 import { UploadTracker } from '../services/UploadTracker'
 
 export const DropFileArea: React.FunctionComponent<{

apps/sensenet/src/components/ErrorBoundary.tsx

@@ -10,7 +10,8 @@ import RefreshTwoTone from '@material-ui/icons/RefreshTwoTone'
 import { Repository } from '@sensenet/client-core'
 import { ExtendedError, isExtendedError } from '@sensenet/client-core/dist/Repository/Repository'
 import React from 'react'
-import { InjectorContext, LocalizationContext } from '../context'
+import { InjectorContext } from '@sensenet/hooks-react'
+import { LocalizationContext } from '../context'
 import { ErrorReport } from './ErrorReport'
 
 export interface ErrorBoundaryState {
@@ -22,7 +23,7 @@ export interface ErrorBoundaryState {
 }
 
 export class ErrorBoundary extends React.Component<{}, ErrorBoundaryState> {
-  public static contextType = InjectorContext
+  public static contextType: React.Context<Injector> = InjectorContext
 
   public state: ErrorBoundaryState = { hasError: false, sendFeedback: false, isOpened: true }
   public static getDerivedStateFromError(error: any) {

apps/sensenet/src/components/Icon.tsx

@@ -37,15 +37,13 @@ import {
   WebAssetTwoTone,
   WidgetsTwoTone,
 } from '@material-ui/icons'
-import { PathHelper } from '@sensenet/client-utils'
+import { PathHelper, tuple } from '@sensenet/client-utils'
 import { GenericContent, File as SnFile, User } from '@sensenet/default-content-types'
 import React from 'react'
 import { Repository } from '@sensenet/client-core'
 import { Avatar } from '@material-ui/core'
-import { useInjector, useRepository } from '../hooks'
+import { useInjector, useRepository } from '@sensenet/hooks-react'
 import { EventLogEntry } from '../services/EventService'
-import { isContentFromType } from '../utils/isContentFromType'
-import { tuple } from '../utils/tuple'
 import { UserAvatar } from './UserAvatar'
 
 export interface IconOptions {
@@ -90,7 +88,7 @@ export const defaultContentResolvers: Array<IconResolver<GenericContent>> = [
   },
   {
     get: (item, options) =>
-      isContentFromType(item, SnFile, options.repo.schemas) &&
+      options.repo.schemas.isContentFromType(item, SnFile) &&
       (item as SnFile).PageCount &&
       (item as any).PageCount > 0 ? (
         <img

apps/sensenet/src/components/LogoutButton.tsx

@@ -10,7 +10,8 @@ import Typography from '@material-ui/core/Typography'
 import PowerSettingsNew from '@material-ui/icons/PowerSettingsNew'
 import { ConstantContent, FormsAuthenticationService, LoginState } from '@sensenet/client-core'
 import React, { useEffect, useState } from 'react'
-import { useLocalization, useLogger, useRepository, useSession, useTheme } from '../hooks'
+import { useLogger, useRepository, useSession } from '@sensenet/hooks-react'
+import { useLocalization, useTheme } from '../hooks'
 import { Icon } from './Icon'
 
 export const LogoutButton: React.FunctionComponent<{

apps/sensenet/src/components/MainRouter.tsx

@@ -1,8 +1,8 @@
 import { LoginState } from '@sensenet/client-core'
 import React, { lazy, Suspense, useEffect, useRef } from 'react'
 import { Route, RouteComponentProps, Switch, withRouter } from 'react-router'
-import { LoadSettingsContextProvider, RepositoryContext } from '../context'
-import { usePersonalSettings, useSession } from '../hooks'
+import { LoadSettingsContextProvider, RepositoryContext, useSession } from '@sensenet/hooks-react'
+import { usePersonalSettings } from '../hooks'
 import { ErrorBoundary } from './ErrorBoundary'
 import { FullScreenLoader } from './FullScreenLoader'
 import { WopiPage } from './wopi-page'
@@ -22,6 +22,7 @@ const EditProperties = lazy(async () => await import(/* webpackChunkName: "editP
 const DocumentViewerComponent = lazy(async () => await import(/* webpackChunkName: "DocViewer" */ './DocViewer'))
 
 const VersionInfoComponent = lazy(async () => await import(/* webpackChunkName: "Version Info" */ './version-info'))
+const TrashComponent = lazy(async () => await import(/* webpackChunkName: "Trash" */ './trash/Trash'))
 const EventListComponent = lazy(async () => await import(/* webpackChunkName: "EventList" */ './event-list'))
 
 const PersonalSettingsEditor = lazy(
@@ -132,6 +133,12 @@ const MainRouter: React.StatelessComponent<RouteComponentProps> = props => {
                         return <VersionInfoComponent />
                       }}
                     />
+                    <Route
+                      path="/:repo/trash"
+                      render={() => {
+                        return <TrashComponent />
+                      }}
+                    />
                     <Route
                       path="/:repo/editBinary/:contentId?"
                       render={() => {