feat: kf auth

.test/setup-kf-auth.ts

@@ -0,0 +1,9 @@
+import { restoreKfAuth, stubKfAuth } from '../stubstub/kfAuth';
+
+beforeAll(() => {
+	stubKfAuth();
+});
+
+afterAll(() => {
+	restoreKfAuth();
+});

client/components/AccountSecuritySettings/AccountSecuritySettings.tsx

@@ -1,8 +1,6 @@
 import React, { useState } from 'react';
 
 import { Button, Callout, Card } from '@blueprintjs/core';
-import encHex from 'crypto-js/enc-hex';
-import SHA3 from 'crypto-js/sha3';
 
 import { apiFetch } from 'client/utils/apiFetch';
 import { InputField } from 'components';
@@ -47,8 +45,8 @@ const AccountSecuritySettings = ({ userEmail }: { userEmail: string }) => {
 		apiFetch('/api/account/password', {
 			method: 'PUT',
 			body: JSON.stringify({
-				currentPassword: SHA3(currentPassword).toString(encHex),
-				newPassword: SHA3(newPassword).toString(encHex),
+				currentPassword,
+				newPassword,
 			}),
 		})
 			.then(() => {
@@ -82,7 +80,7 @@ const AccountSecuritySettings = ({ userEmail }: { userEmail: string }) => {
 			method: 'POST',
 			body: JSON.stringify({
 				newEmail: submittedEmailValue,
-				password: SHA3(emailPassword).toString(encHex),
+				password: emailPassword,
 			}),
 		})
 			.then(() => {

client/components/MinimalEditor/MinimalEditor.tsx

@@ -62,6 +62,7 @@ const MinimalEditor = (props: Props) => {
 	}, []);
 
 	useEffect(() => {
+		// @ts-expect-error webpack does not like the correct /index.js path
 		import('../FormattingBar').then(({ buttons, FormattingBar: FormattingBarComponent }) => {
 			setFormattingBar(() => (innerProps) => (
 				<FormattingBarComponent {...innerProps} buttons={getButtons(buttons as any)} />

client/containers/DashboardCustomScripts/DashboardCustomScripts.tsx

@@ -26,7 +26,12 @@ const DashboardCustomScripts = (props: Props) => {
 		import(
 			/* webpackChunkName: "@monaco-editor/react" */
 			'@monaco-editor/react'
-		).then(({ default: EditorComponent }) => setEditor(EditorComponent));
+		).then(({ default: EditorComponent }) =>
+			setEditor(
+				// @ts-expect-error somehow not assignable to EditorComponentType after -> module resolution change
+				EditorComponent,
+			),
+		);
 	}, []);
 
 	const renderLoading = () => {

client/containers/Login/Login.tsx

@@ -3,8 +3,6 @@ import type { AltchaRef } from 'components';
 import React, { useRef, useState } from 'react';
 
 import { AnchorButton, Button, Classes, NonIdealState } from '@blueprintjs/core';
-import encHex from 'crypto-js/enc-hex';
-import SHA3 from 'crypto-js/sha3';
 
 import { apiFetch } from 'client/utils/apiFetch';
 import { Altcha, Avatar, GridWrapper, InputField } from 'components';
@@ -44,7 +42,7 @@ const Login = () => {
 					// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
 					email: emailRef.current.value.toLowerCase(),
 					// @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
-					password: SHA3(passwordRef.current.value).toString(encHex),
+					password: passwordRef.current.value,
 					altcha: altchaPayload,
 				}),
 			})

client/containers/PasswordReset/PasswordReset.tsx

@@ -1,8 +1,6 @@
 import React, { useState } from 'react';
 
 import { AnchorButton, Button, Classes, NonIdealState } from '@blueprintjs/core';
-import encHex from 'crypto-js/enc-hex';
-import SHA3 from 'crypto-js/sha3';
 
 import { apiFetch } from 'client/utils/apiFetch';
 import { GridWrapper, InputField } from 'components';
@@ -61,9 +59,8 @@ const PasswordReset = (props: Props) => {
 		return apiFetch('/api/password-reset', {
 			method: 'PUT',
 			body: JSON.stringify({
-				password: SHA3(password).toString(encHex),
-				slug: locationData.params.slug,
-				resetHash: locationData.params.resetHash,
+				password,
+				token: locationData.query.token || locationData.params.resetHash,
 			}),
 		})
 			.then(() => {
@@ -81,11 +78,15 @@ const PasswordReset = (props: Props) => {
 	return (
 		<div id="password-reset-container">
 			<GridWrapper containerClassName="small">
-				{!showConfirmation && !resetHash && <h1>Reset Password</h1>}
-				{!showConfirmation && !!resetHash && <h1>Set Password</h1>}
+				{!showConfirmation && !resetHash && !passwordResetData.token && (
+					<h1>Reset Password</h1>
+				)}
+				{!showConfirmation && (!!resetHash || !!passwordResetData.token) && (
+					<h1>Set Password</h1>
+				)}
 
 				{/* Show form to submit email */}
-				{!resetHash && !showConfirmation && (
+				{!resetHash && !passwordResetData.token && !showConfirmation && (
 					<form onSubmit={handlePostPasswordReset}>
 						<p>
 							Enter your email and a link to reset your password will be sent to you.
@@ -112,7 +113,7 @@ const PasswordReset = (props: Props) => {
 				)}
 
 				{/* Show password reset request confirmation, with directions to check email  */}
-				{!resetHash && showConfirmation && (
+				{!resetHash && !passwordResetData.token && showConfirmation && (
 					<NonIdealState
 						description="If your email is known to us, we have sent you an email with a reset link"
 						title="Reset Password Email Sent"
@@ -152,22 +153,45 @@ const PasswordReset = (props: Props) => {
 					</form>
 				)}
 
-				{/* Show confirmation of password reset. Link to Login */}
-				{resetHash && passwordResetData.hashIsValid && showConfirmation && (
-					<NonIdealState
-						description="Your password has been successfully changed."
-						title="Reset Password Successful"
-						// @ts-expect-error ts-migrate(2322) FIXME: Type '{ description: string; title: string; visual... Remove this comment to see the full error message
-						visual="tick"
-						action={
-							<AnchorButton
-								href="/login"
-								className={`${Classes.INTENT_PRIMARY} ${Classes.LARGE}`}
-								text="Login with new password"
+				{!resetHash && passwordResetData.token && !showConfirmation && (
+					<form onSubmit={handlePutPasswordReset}>
+						<InputField
+							label="Password"
+							type="password"
+							value={password}
+							onChange={onPasswordChange}
+						/>
+						<InputField error={putError && 'Error Resetting Password'}>
+							<Button
+								name="create"
+								type="submit"
+								className={`${Classes.BUTTON} ${Classes.INTENT_PRIMARY} create-account-button`}
+								onClick={handlePutPasswordReset}
+								text="Set New Password"
+								disabled={!password}
+								loading={putIsLoading}
 							/>
-						}
-					/>
+						</InputField>
+					</form>
 				)}
+
+				{/* Show confirmation of password reset. Link to Login */}
+				{((resetHash && passwordResetData.hashIsValid) || passwordResetData.token) &&
+					showConfirmation && (
+						<NonIdealState
+							description="Your password has been successfully changed."
+							title="Reset Password Successful"
+							// @ts-expect-error ts-migrate(2322) FIXME: Type '{ description: string; title: string; visual... Remove this comment to see the full error message
+							visual="tick"
+							action={
+								<AnchorButton
+									href="/login"
+									className={`${Classes.INTENT_PRIMARY} ${Classes.LARGE}`}
+									text="Login with new password"
+								/>
+							}
+						/>
+					)}
 			</GridWrapper>
 		</div>
 	);

client/containers/UserCreate/UserCreate.tsx

@@ -1,8 +1,6 @@
 import React, { useRef, useState } from 'react';
 
 import { Button, Checkbox, Classes, NonIdealState } from '@blueprintjs/core';
-import encHex from 'crypto-js/enc-hex';
-import SHA3 from 'crypto-js/sha3';
 
 import { apiFetch } from 'client/utils/apiFetch';
 import { gdprCookiePersistsSignup, getGdprConsentElection } from 'client/utils/legal/gdprConsent';
@@ -57,7 +55,7 @@ const UserCreate = (props: Props) => {
 				subscribed,
 				firstName,
 				lastName,
-				password: SHA3(password).toString(encHex),
+				password,
 				avatar,
 				title,
 				bio,

infra/docker-compose.dev.yml

@@ -23,12 +23,16 @@ services:
             PORT: 3000
             DATABASE_URL: postgres://appuser:apppassword@db:5432/appdb
             CLOUDAMQP_URL: amqp://appuser:apppassword@rabbitmq:5672/appvhost
+            # KF_AUTH_URL: http://kf-auth:3000
+            # KF_AUTH_ADMIN_API_KEY: dev-admin-api-key-change-me
+            # KF_AUTH_WEBHOOK_SECRET: dev-webhook-secret
         depends_on:
             - db
             - rabbitmq
+            # - kf-auth
         ports:
             - "${WEB_PORT:-9876}:3000"
-        networks: [appnet]
+        networks: [ appnet ]
         volumes:
             - ..:/app
 
@@ -42,16 +46,19 @@ services:
         environment:
             NODE_ENV: development
             CLOUDAMQP_URL: amqp://appuser:apppassword@rabbitmq:5672/appvhost
+            # KF_AUTH_URL: http://kf-auth:3000
+            # KF_AUTH_ADMIN_API_KEY: dev-admin-api-key-change-me
+            # KF_AUTH_WEBHOOK_SECRET: dev-webhook-secret
 
-        command: ["pnpm", "run", "workers-dev"]
+        command: [ "pnpm", "run", "workers-dev" ]
         depends_on:
             db:
                 condition: service_started
             rabbitmq:
                 condition: service_started
             # app:
             #     condition: service_healthy
-        networks: [appnet]
+        networks: [ appnet ]
         volumes:
             - ..:/app
 
@@ -63,7 +70,7 @@ services:
             RABBITMQ_DEFAULT_VHOST: appvhost
         volumes:
             - rabbitmqdata:/var/lib/rabbitmq
-        networks: [appnet]
+        networks: [ appnet ]
         ports:
             - "${RABBITMQ_PORT:-5672}:5672"
 
@@ -76,17 +83,50 @@ services:
             - POSTGRES_PASSWORD=apppassword
             - POSTGRES_DB=appdb
         command: >
-            -c shared_buffers=2GB
-            -c effective_cache_size=6GB
-            -c work_mem=16MB
+            -c shared_buffers=2GB -c effective_cache_size=6GB -c work_mem=16MB
             -c maintenance_work_mem=512MB
         volumes:
             - pgdata:/var/lib/postgresql/data
         ports:
             - "${DB_PORT:-5439}:5432"
-        networks: [appnet]
+        networks: [ appnet ]
+    # kf-auth-db:
+    #     image: postgres:16-alpine
+    #     environment:
+    #         POSTGRES_USER: kfauth
+    #         POSTGRES_PASSWORD: kfauth
+    #         POSTGRES_DB: kfauth_dev
+    #     volumes:
+    #         - kfauthdata:/var/lib/postgresql/data
+    #     networks: [appnet]
 
+    # kf-auth:
+    #     build:
+    #         context: ../../kf-auth
+    #         dockerfile: docker/Dockerfile
+    #     environment:
+    #         DATABASE_URL: postgres://kfauth:kfauth@knowledgefutures-auth-db:5432/kfauth_dev
+    #         BETTER_AUTH_SECRET: dev-secret-change-me
+    #         BETTER_AUTH_URL: http://localhost:3456
+    #         SMTP_HOST: inbucket
+    #         SMTP_PORT: "2500"
+    #         SMTP_FROM: noreply@knowledgefuturesauth.dev
+    #         SEED_ADMIN_EMAIL: admin@knowledgefuturesauth.dev
+    #         SEED_ADMIN_PASSWORD: changeme123
+    #         ADMIN_API_KEY: dev-admin-api-key-change-me
+    #         PORT: "3000"
+    #     depends_on:
+    #         - kf-auth-db
+    #         - inbucket
+    #     ports:
+    #         - "${KF_AUTH_PORT:-3456}:3000"
+    #     networks: [appnet]
 
+    # inbucket:
+    #     image: inbucket/inbucket:latest
+    #     ports:
+    #         - "9999:9000"
+    #     networks: [appnet]
 
     # cron:
     #     build:
@@ -113,4 +153,5 @@ networks:
 volumes:
     pgdata:
     rabbitmqdata:
+    kfauthdata:
 

package.json

@@ -81,6 +81,7 @@
 		"@codemirror/state": "^0.20.0",
 		"@codemirror/view": "^0.20.0",
 		"@google-cloud/storage": "^7.9.0",
+		"@knowledgefutures/sdk": "file:/Users/thomas/Projects/kf/pubpub/knowledgefutures-sdk-0.1.0.tgz",
 		"@lezer/common": "^1.0.1",
 		"@lezer/cpp": "^1.0.0",
 		"@lezer/css": "^1.1.0",
@@ -378,7 +379,8 @@
 			"validate-with-xmllint"
 		],
 		"patchedDependencies": {
-			"reakit": "patches/reakit.patch"
+			"reakit": "patches/reakit.patch",
+			"@pubpub/deposit-utils": "patches/@pubpub__deposit-utils.patch"
 		}
 	}
 }

patches/@pubpub__deposit-utils.patch

@@ -0,0 +1,17 @@
+diff --git a/package.json b/package.json
+index ff9f6ae0f025e5528dd1448730e4f25c10284efb..d022c3ed4245e1b153cddab1b0eccef8e84fa86d 100644
+--- a/package.json
++++ b/package.json
+@@ -21,10 +21,12 @@
+   "exports": {
+     ".": "./index.js",
+     "./crossref": {
++      "types": "./dist/dts/crossref/index.d.ts",
+       "import": "./dist/esm/crossref/index.js",
+       "require": "./dist/cjs/crossref/index.js"
+     },
+     "./datacite": {
++      "types": "./dist/dts/datacite/index.d.ts",
+       "import": "./dist/esm/datacite/index.js",
+       "require": "./dist/cjs/datacite/index.js"
+     }