holdingpen: author submission prototype

* ref: cern-sis/issues-inspire#468

ui/src/authors/components/PublicationsSelectAll.tsx

@@ -1,16 +1,22 @@
 import React, { useMemo } from 'react';
-import { List, Map, Set } from 'immutable';
+import { List, Set } from 'immutable';
 import { Checkbox } from 'antd';
 
-function getRecordId<T>(result: { getIn: (args: string[], arg?: boolean) => T }) {
+function getRecordId<T>(result: {
+  getIn: (args: string[], arg?: boolean) => T;
+}) {
   return result.getIn(['metadata', 'control_number']);
 }
 
-function getClaimed<T>(result: { getIn: (args: string[], arg?: boolean) => T }) {
+function getClaimed<T>(result: {
+  getIn: (args: string[], arg?: boolean) => T;
+}) {
   return result.getIn(['metadata', 'curated_relation'], false);
 }
 
-function getCanClaim<T>(result: { getIn: (args: string[], arg?: boolean) => T }) {
+function getCanClaim<T>(result: {
+  getIn: (args: string[], arg?: boolean) => T;
+}) {
   return result.getIn(['metadata', 'can_claim'], false);
 }
 
@@ -20,10 +26,10 @@ function PublicationsSelectAll<T>({
   onChange,
   disabled,
 }: {
-  publications: List<any>,
-  selection: Set<T>,
-  onChange: Function,
-  disabled: boolean,
+  publications: List<any>;
+  selection: Set<T>;
+  onChange: Function;
+  disabled?: boolean;
 }) {
   const checked = useMemo(
     () =>

ui/src/common/components/ContentBox/ContentBox.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Row, Col, Card } from 'antd';
+import classNames from 'classnames';
 
 import './ContentBox.less';
 
@@ -11,6 +12,8 @@ const ContentBox = ({
   children,
   subTitle,
   className,
+  fullHeight = true,
+  smallPadding = true,
 }: {
   title: string;
   leftActions: JSX.Element | JSX.Element[];
@@ -19,12 +22,26 @@ const ContentBox = ({
   children: JSX.Element | JSX.Element[] | any;
   subTitle: string;
   className: string;
+  fullHeight?: boolean;
+  smallPadding?: boolean;
 }) => {
   return (
     children && (
-      <div className={`__ContentBox__ h-100 ${className}`}>
+      <div
+        className={classNames(
+          '__ContentBox__',
+          { 'h-100': fullHeight },
+          className
+        )}
+      >
         <Card className="h-100" title={title} loading={loading}>
-          <div className="pa2">
+          <div
+            className={classNames(
+              { pa2: smallPadding },
+              { pa3: !smallPadding },
+              className
+            )}
+          >
             {subTitle && <h3 className="pb1">{subTitle}</h3>}
             <div>{children}</div>
           </div>

ui/src/common/components/LinkLikeButton/LinkLikeButton.less

@@ -11,7 +11,7 @@
       & > *:hover {
         text-decoration: underline;
       }
-    } 
+    }
   }
   &.blue {
     color: #0050b3;
@@ -20,7 +20,7 @@
     }
   }
   &.middle {
-    font-size: 1rem;
+    font-size: 1.1rem;
   }
   &.big {
     font-size: 1.5rem;

ui/src/common/components/LinkLikeButton/LinkLikeButton.tsx

@@ -10,19 +10,21 @@ const LinkLikeButton = ({
   dataTestId,
   color,
   disabled,
+  className,
 }: {
   children: JSX.Element | string;
   onClick: MouseEventHandler<HTMLElement>;
   dataTestId: string;
   color: string;
   disabled: boolean;
+  className?: string;
 }) => (
   <Button
     disabled={disabled}
     type="text"
     data-test-id={dataTestId}
     onClick={onClick}
-    className={classNames('__LinkLikeButton__', color, { 'disabled': disabled })}
+    className={classNames('__LinkLikeButton__', color, { disabled }, className)}
     data-testid={dataTestId}
   >
     {children}

ui/src/common/components/Logo/Logo.less

@@ -4,4 +4,8 @@
     height: 32px;
     vertical-align: middle;
   }
-}
+}
+.holdingpen .logo {
+  height: fit-content;
+  padding: 5px;
+}

ui/src/common/components/Logo/LogoHoldingpen.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+import './Logo.less';
+import { HOLDINGPEN } from '../../routes';
+import { ReactComponent as LogoSvg } from './logo-holdingpen.svg';
+
+const LogoHoldingpen = () => (
+  <Link className="__Logo__" to={HOLDINGPEN}>
+    <LogoSvg className="logo" />
+  </Link>
+);
+
+export default LogoHoldingpen;

ui/src/common/components/Logo/index.ts

@@ -1,3 +1,4 @@
 import Logo from './Logo';
+import LogoHoldingpen from './LogoHoldingpen';
 
-export default Logo;
+export { Logo, LogoHoldingpen };