feat: auth & workspace load

This commit is contained in:
DarkSky
2022-12-30 19:42:01 +08:00
committed by DarkSky
parent 7b34ea010c
commit b01703b836
26 changed files with 161 additions and 518 deletions

View File

@@ -1,17 +1,9 @@
import { initializeApp } from 'firebase/app';
import {
getAuth,
createUserWithEmailAndPassword,
signInWithEmailAndPassword,
GoogleAuthProvider,
signInWithPopup,
} from 'firebase/auth';
import { getAuth, GoogleAuthProvider, signInWithPopup } from 'firebase/auth';
import type { User } from 'firebase/auth';
import { token } from './request';
// TODO: temporary reference, move all api into affine provider
import { token } from './datacenter/provider/affine/token';
/**
* firebaseConfig reference: https://firebase.google.com/docs/web/setup#add_firebase_to_your_app
*/
const app = initializeApp({
apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
@@ -24,14 +16,6 @@ const app = initializeApp({
export const firebaseAuth = getAuth(app);
const signUp = (email: string, password: string) => {
return createUserWithEmailAndPassword(firebaseAuth, email, password);
};
const signIn = (email: string, password: string) => {
return signInWithEmailAndPassword(firebaseAuth, email, password);
};
const googleAuthProvider = new GoogleAuthProvider();
export const signInWithGoogle = async () => {
const user = await signInWithPopup(firebaseAuth, googleAuthProvider);

View File

@@ -1,5 +1,6 @@
import { Workspace } from '@blocksuite/store';
import assert from 'assert';
import { BlockSchema } from '@blocksuite/blocks/models';
import { Workspace } from '@blocksuite/store';
import { AffineProvider, BaseProvider } from './provider/index.js';
import { MemoryProvider } from './provider/index.js';
@@ -27,7 +28,8 @@ export class DataCenter {
}
private async _initWithProvider(id: string, providerId: string) {
const workspace = new Workspace({ room: id });
// init workspace & register block schema
const workspace = new Workspace({ room: id }).register(BlockSchema);
const Provider = this._providers.get(providerId);
assert(Provider);
@@ -59,13 +61,20 @@ export class DataCenter {
}
}
async initWorkspace(id: string, provider = 'memory'): Promise<Workspace> {
if (!this._workspaces.has(id)) {
this._workspaces.set(id, this._initWorkspace(id, provider));
async initWorkspace(
id: string,
provider = 'memory'
): Promise<Workspace | null> {
if (id) {
console.log('initWorkspace', id);
if (!this._workspaces.has(id)) {
this._workspaces.set(id, this._initWorkspace(id, provider));
}
const workspace = this._workspaces.get(id);
assert(workspace);
return workspace.then(w => w.workspace);
}
const workspace = this._workspaces.get(id);
assert(workspace);
return workspace.then(w => w.workspace);
return null;
}
setWorkspaceConfig(workspace: string, key: string, value: any) {

View File

@@ -0,0 +1,7 @@
import { client } from './request.js';
export async function downloadWorkspace(
workspaceId: string
): Promise<ArrayBuffer> {
return client.get(`api/workspace/${workspaceId}/doc`).arrayBuffer();
}

View File

@@ -1,28 +0,0 @@
import { AccessTokenMessage } from './token';
export type Callback = (user: AccessTokenMessage | null) => void;
export class AuthorizationEvent {
private callbacks: Callback[] = [];
private lastState: AccessTokenMessage | null = null;
/**
* Callback will execute when call this function.
*/
onChange(callback: Callback) {
this.callbacks.push(callback);
callback(this.lastState);
}
triggerChange(user: AccessTokenMessage | null) {
this.lastState = user;
this.callbacks.forEach(callback => callback(user));
}
removeCallback(callback: Callback) {
const index = this.callbacks.indexOf(callback);
if (index > -1) {
this.callbacks.splice(index, 1);
}
}
}

View File

@@ -1,9 +1,8 @@
import assert from 'assert';
import { Workspace } from '@blocksuite/store';
import { BaseProvider } from '../base.js';
import { ConfigStore } from '../index.js';
import { token } from './token.js';
import { Callback } from './events.js';
import { BaseProvider, ConfigStore } from '../index.js';
import { downloadWorkspace } from './apis.js';
import { token, Callback } from './token.js';
export class AffineProvider extends BaseProvider {
static id = 'affine';
@@ -24,9 +23,23 @@ export class AffineProvider extends BaseProvider {
assert(this._onTokenRefresh);
token.onChange(this._onTokenRefresh);
// initial login token
if (token.isExpired) {
const refreshToken = await this._config.get('token');
await token.refreshToken(refreshToken);
try {
const refreshToken = await this._config.get('token');
await token.refreshToken(refreshToken);
if (token.refresh) {
this._config.set('token', token.refresh);
}
assert(token.isLogin);
} catch (_) {
console.warn('authorization failed, fallback to local mode');
}
} else {
this._config.set('token', token.refresh);
}
}
@@ -37,6 +50,25 @@ export class AffineProvider extends BaseProvider {
}
async initData() {
console.log('initData', token.isLogin);
const workspace = this._workspace;
const doc = workspace.doc;
console.log(workspace.room, token.isLogin);
if (workspace.room && token.isLogin) {
try {
const updates = await downloadWorkspace(workspace.room);
if (updates) {
Workspace.Y.applyUpdate(doc, new Uint8Array(updates));
}
} catch (e) {
console.warn('Failed to init cloud workspace', e);
}
}
// if after update, the space:meta is empty
// then we need to get map with doc
// just a workaround for yjs
doc.getMap('space:meta');
}
}

View File

@@ -1,3 +1,4 @@
import kyOrigin from 'ky';
import ky from 'ky-universal';
import { token } from './token.js';
@@ -20,6 +21,7 @@ export const bareClient = ky.extend({
// ],
},
});
export const client = bareClient.extend({
hooks: {
beforeRequest: [
@@ -41,6 +43,3 @@ export const client = bareClient.extend({
],
},
});
export type { AccessTokenMessage } from './token';
export { token };

View File

@@ -1,5 +1,4 @@
import { bareClient } from './request.js';
import { AuthorizationEvent, Callback } from './events.js';
export interface AccessTokenMessage {
create_at: number;
@@ -10,6 +9,8 @@ export interface AccessTokenMessage {
avatar_url: string;
}
export type Callback = (user: AccessTokenMessage | null) => void;
type LoginParams = {
type: 'Google' | 'Refresh';
token: string;
@@ -25,21 +26,7 @@ type LoginResponse = {
const login = (params: LoginParams): Promise<LoginResponse> =>
bareClient.post('api/user/token', { json: params }).json();
function b64DecodeUnicode(str: string) {
// Going backwards: from byte stream, to percent-encoding, to original string.
return decodeURIComponent(
window
.atob(str)
.split('')
.map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
})
.join('')
);
}
class Token {
private readonly _event: AuthorizationEvent;
private _accessToken!: string;
private _refreshToken!: string;
@@ -47,16 +34,18 @@ class Token {
private _padding?: Promise<LoginResponse>;
constructor() {
this._event = new AuthorizationEvent();
this._setToken(); // fill with default value
}
private _setToken(login?: LoginResponse) {
console.log('set login', login);
this._accessToken = login?.token || '';
this._refreshToken = login?.refresh || '';
this._user = Token.parse(this._accessToken);
this._event.triggerChange(this._user);
if (login) {
this.triggerChange(this._user);
}
}
async initToken(token: string) {
@@ -96,21 +85,43 @@ class Token {
static parse(token: string): AccessTokenMessage | null {
try {
const message: AccessTokenMessage = JSON.parse(
b64DecodeUnicode(token.split('.')[1])
return JSON.parse(
String.fromCharCode.apply(
null,
Array.from(
Uint8Array.from(
window.atob(
// split jwt
token.split('.')[1]
),
c => c.charCodeAt(0)
)
)
)
);
return message;
} catch (error) {
return null;
}
}
private callbacks: Callback[] = [];
private lastState: AccessTokenMessage | null = null;
triggerChange(user: AccessTokenMessage | null) {
this.lastState = user;
this.callbacks.forEach(callback => callback(user));
}
onChange(callback: Callback) {
this._event.onChange(callback);
this.callbacks.push(callback);
callback(this.lastState);
}
offChange(callback: Callback) {
this._event.removeCallback(callback);
const index = this.callbacks.indexOf(callback);
if (index > -1) {
this.callbacks.splice(index, 1);
}
}
}

View File

@@ -1,6 +1,9 @@
export { signInWithGoogle, onAuthStateChanged } from './auth';
export * from './request';
export * from './sdks';
export * from './websocket';
export { getDataCenter } from './datacenter';
// TODO: temporary reference, move all api into affine provider
export { token } from './datacenter/provider/affine/token';
export type { AccessTokenMessage } from './datacenter/provider/affine/token';

View File

@@ -1,28 +0,0 @@
import { AccessTokenMessage } from './token';
export type Callback = (user: AccessTokenMessage | null) => void;
export class AuthorizationEvent {
private callbacks: Callback[] = [];
private lastState: AccessTokenMessage | null = null;
/**
* Callback will execute when call this function.
*/
onChange(callback: Callback) {
this.callbacks.push(callback);
callback(this.lastState);
}
triggerChange(user: AccessTokenMessage | null) {
this.lastState = user;
this.callbacks.forEach(callback => callback(user));
}
removeCallback(callback: Callback) {
const index = this.callbacks.indexOf(callback);
if (index > -1) {
this.callbacks.splice(index, 1);
}
}
}

View File

@@ -1,45 +0,0 @@
import ky from 'ky';
import { token } from './token';
export const bareClient = ky.extend({
retry: 1,
hooks: {
// afterResponse: [
// async (_request, _options, response) => {
// if (response.status === 200) {
// const data = await response.json();
// if (data.error) {
// return new Response(data.error.message, {
// status: data.error.code,
// });
// }
// }
// return response;
// },
// ],
},
});
export const client = bareClient.extend({
hooks: {
beforeRequest: [
async request => {
if (token.isLogin) {
if (token.isExpired) await token.refreshToken();
request.headers.set('Authorization', token.token);
} else {
return new Response('Unauthorized', { status: 401 });
}
},
],
beforeRetry: [
async ({ request }) => {
await token.refreshToken();
request.headers.set('Authorization', token.token);
},
],
},
});
export type { AccessTokenMessage } from './token';
export { token };

View File

@@ -1,138 +0,0 @@
import { bareClient } from '.';
import { AuthorizationEvent, Callback } from './events';
export interface AccessTokenMessage {
create_at: number;
exp: number;
email: string;
id: string;
name: string;
avatar_url: string;
}
const TOKEN_KEY = 'affine_token';
type LoginParams = {
type: 'Google' | 'Refresh';
token: string;
};
type LoginResponse = {
// JWT, expires in a very short time
token: string;
// Refresh token
refresh: string;
};
const login = (params: LoginParams): Promise<LoginResponse> =>
bareClient.post('/api/user/token', { json: params }).json();
function b64DecodeUnicode(str: string) {
// Going backwards: from byte stream, to percent-encoding, to original string.
return decodeURIComponent(
window
.atob(str)
.split('')
.map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
})
.join('')
);
}
function getRefreshToken() {
try {
return localStorage.getItem(TOKEN_KEY) || '';
} catch (_) {
return '';
}
}
function setRefreshToken(token: string) {
try {
localStorage.setItem(TOKEN_KEY, token);
} catch (_) {}
}
class Token {
private readonly _event: AuthorizationEvent;
private _accessToken: string;
private _refreshToken: string;
private _user: AccessTokenMessage | null;
private _padding?: Promise<LoginResponse>;
constructor(refreshToken?: string) {
this._accessToken = '';
this._refreshToken = refreshToken || getRefreshToken();
this._event = new AuthorizationEvent();
this._user = Token.parse(this._accessToken);
this._event.triggerChange(this._user);
}
private _setToken(login: LoginResponse) {
this._accessToken = login.token;
this._refreshToken = login.refresh;
this._user = Token.parse(login.token);
this._event.triggerChange(this._user);
setRefreshToken(login.refresh);
}
async initToken(token: string) {
this._setToken(await login({ token, type: 'Google' }));
}
async refreshToken() {
if (!this._refreshToken) {
throw new Error('No authorization token.');
}
if (!this._padding) {
this._padding = login({
type: 'Refresh',
token: this._refreshToken,
});
}
this._setToken(await this._padding);
this._padding = undefined;
}
get token() {
return this._accessToken;
}
get refresh() {
return this._refreshToken;
}
get isLogin() {
return !!this._refreshToken;
}
get isExpired() {
if (!this._user) return true;
return Date.now() - this._user.create_at > this._user.exp;
}
static parse(token: string): AccessTokenMessage | null {
try {
const message: AccessTokenMessage = JSON.parse(
b64DecodeUnicode(token.split('.')[1])
);
return message;
} catch (error) {
return null;
}
}
onChange(callback: Callback) {
this._event.onChange(callback);
}
offChange(callback: Callback) {
this._event.removeCallback(callback);
}
}
export const token = new Token();

View File

@@ -1,4 +1,2 @@
export * from './workspace';
export * from './workspace.hook';
export * from './user';
export * from './user.hook';

View File

@@ -1,2 +0,0 @@
export type CommonError = { error: { code: string; message: string } };
export type MayError = Partial<CommonError>;

View File

@@ -1 +0,0 @@
export * from './common';

View File

@@ -1,23 +0,0 @@
import useSWR from 'swr';
import type { SWRConfiguration } from 'swr';
import { getUserByEmail } from './user';
import type { GetUserByEmailParams, User } from './user';
export const GET_USER_BY_EMAIL_SWR_TOKEN = 'user.getUserByEmail';
export function useGetUserByEmail(
params: GetUserByEmailParams,
config?: SWRConfiguration
) {
const { data, error, isLoading, mutate } = useSWR<User | null>(
[GET_USER_BY_EMAIL_SWR_TOKEN, params],
([_, params]) => getUserByEmail(params),
config
);
return {
loading: isLoading,
data,
error,
mutate,
};
}

View File

@@ -1,4 +1,5 @@
import { client } from '../request';
// TODO: temporary reference, move all api into affine provider
import { client } from '../datacenter/provider/affine/request';
export interface GetUserByEmailParams {
email: string;
@@ -17,5 +18,5 @@ export async function getUserByEmail(
params: GetUserByEmailParams
): Promise<User | null> {
const searchParams = new URLSearchParams({ ...params });
return client.get('/api/user', { searchParams }).json<User | null>();
return client.get('api/user', { searchParams }).json<User | null>();
}

View File

@@ -1,72 +0,0 @@
import useSWR from 'swr';
import type { SWRConfiguration } from 'swr';
import {
getWorkspaceDetail,
updateWorkspace,
deleteWorkspace,
inviteMember,
Workspace,
} from './workspace';
import {
GetWorkspaceDetailParams,
WorkspaceDetail,
UpdateWorkspaceParams,
DeleteWorkspaceParams,
InviteMemberParams,
getWorkspaces,
} from './workspace';
export const GET_WORKSPACE_DETAIL_SWR_TOKEN = 'workspace.getWorkspaceDetail';
export function useGetWorkspaceDetail(
params: GetWorkspaceDetailParams,
config?: SWRConfiguration
) {
const { data, error, isLoading, mutate } = useSWR<WorkspaceDetail | null>(
[GET_WORKSPACE_DETAIL_SWR_TOKEN, params],
([_, params]) => getWorkspaceDetail(params),
config
);
return {
data,
error,
loading: isLoading,
mutate,
};
}
export const GET_WORKSPACES_SWR_TOKEN = 'workspace.getWorkspaces';
export function useGetWorkspaces(config?: SWRConfiguration) {
const { data, error, isLoading } = useSWR<Workspace[]>(
[GET_WORKSPACES_SWR_TOKEN],
() => getWorkspaces(),
config
);
return {
data,
error,
loading: isLoading,
};
}
export const UPDATE_WORKSPACE_SWR_TOKEN = 'workspace.updateWorkspace';
/**
* I don't think a hook needed for update workspace.
* If you figure out the scene, please implement this function.
*/
export function useUpdateWorkspace() {}
export const DELETE_WORKSPACE_SWR_TOKEN = 'workspace.deleteWorkspace';
/**
* I don't think a hook needed for delete workspace.
* If you figure out the scene, please implement this function.
*/
export function useDeleteWorkspace() {}
export const INVITE_MEMBER_SWR_TOKEN = 'workspace.inviteMember';
/**
* I don't think a hook needed for invite member.
* If you figure out the scene, please implement this function.
*/
export function useInviteMember() {}

View File

@@ -1,4 +1,5 @@
import { client, bareClient } from '../request';
// TODO: temporary reference, move all api into affine provider
import { bareClient, client } from '../datacenter/provider/affine/request';
import { User } from './user';
export interface GetWorkspaceDetailParams {
@@ -27,7 +28,7 @@ export interface Workspace {
export async function getWorkspaces(): Promise<Workspace[]> {
return client
.get('/api/workspace', {
.get('api/workspace', {
headers: {
'Cache-Control': 'no-cache',
},
@@ -43,7 +44,7 @@ export interface WorkspaceDetail extends Workspace {
export async function getWorkspaceDetail(
params: GetWorkspaceDetailParams
): Promise<WorkspaceDetail | null> {
return client.get(`/api/workspace/${params.id}`).json();
return client.get(`api/workspace/${params.id}`).json();
}
export interface Permission {
@@ -74,7 +75,7 @@ export interface GetWorkspaceMembersParams {
export async function getWorkspaceMembers(
params: GetWorkspaceDetailParams
): Promise<Member[]> {
return client.get(`/api/workspace/${params.id}/permission`).json();
return client.get(`api/workspace/${params.id}/permission`).json();
}
export interface CreateWorkspaceParams {
@@ -85,7 +86,7 @@ export interface CreateWorkspaceParams {
export async function createWorkspace(
params: CreateWorkspaceParams
): Promise<void> {
return client.post('/api/workspace', { json: params }).json();
return client.post('api/workspace', { json: params }).json();
}
export interface UpdateWorkspaceParams {
@@ -97,7 +98,7 @@ export async function updateWorkspace(
params: UpdateWorkspaceParams
): Promise<{ public: boolean | null }> {
return client
.post(`/api/workspace/${params.id}`, {
.post(`api/workspace/${params.id}`, {
json: {
public: params.public,
},
@@ -112,7 +113,7 @@ export interface DeleteWorkspaceParams {
export async function deleteWorkspace(
params: DeleteWorkspaceParams
): Promise<void> {
await client.delete(`/api/workspace/${params.id}`);
await client.delete(`api/workspace/${params.id}`);
}
export interface InviteMemberParams {
@@ -125,7 +126,7 @@ export interface InviteMemberParams {
*/
export async function inviteMember(params: InviteMemberParams): Promise<void> {
return client
.post(`/api/workspace/${params.id}/permission`, {
.post(`api/workspace/${params.id}/permission`, {
json: {
email: params.email,
},
@@ -138,7 +139,7 @@ export interface RemoveMemberParams {
}
export async function removeMember(params: RemoveMemberParams): Promise<void> {
await client.delete(`/api/permission/${params.permissionId}`);
await client.delete(`api/permission/${params.permissionId}`);
}
export interface AcceptInvitingParams {
@@ -148,31 +149,22 @@ export interface AcceptInvitingParams {
export async function acceptInviting(
params: AcceptInvitingParams
): Promise<void> {
await bareClient.post(`/api/invitation/${params.invitingCode}`);
}
export interface DownloadWOrkspaceParams {
workspaceId: string;
}
export async function downloadWorkspace(
params: DownloadWOrkspaceParams
): Promise<ArrayBuffer> {
return client.get(`/api/workspace/${params.workspaceId}/doc`).arrayBuffer();
await bareClient.post(`api/invitation/${params.invitingCode}`);
}
export async function uploadBlob(params: { blob: Blob }): Promise<string> {
return client.put('/api/blob', { body: params.blob }).text();
return client.put('api/blob', { body: params.blob }).text();
}
export async function getBlob(params: {
blobId: string;
}): Promise<ArrayBuffer> {
return client.get(`/api/blob/${params.blobId}`).arrayBuffer();
return client.get(`api/blob/${params.blobId}`).arrayBuffer();
}
export interface LeaveWorkspaceParams {
id: number | string;
}
export async function leaveWorkspace({ id }: LeaveWorkspaceParams) {
await client.delete(`/api/workspace/${id}/permission`).json();
await client.delete(`api/workspace/${id}/permission`).json();
}