@dxos/plugin-chess 0.8.3 → 0.8.4-main.1da679c

package/src/components/ChessComponent.tsx

@@ -1,54 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Chess } from 'chess.js';
-import React, { useCallback, useEffect, useMemo } from 'react';
-
-import { log } from '@dxos/log';
-import { getSpace } from '@dxos/react-client/echo';
-import { ChessModel, Board, Chessboard, type BoardRootProps } from '@dxos/react-ui-gameboard';
-
-import { type ChessType } from '../types';
-
-export const ChessComponent = ({ game }: { game: ChessType }) => {
-  const model = useMemo(() => new ChessModel(), []);
-  useEffect(() => {
-    if (!model || game.pgn !== model?.game.pgn()) {
-      const chess = new Chess();
-      if (game.pgn) {
-        try {
-          chess.loadPgn(game.pgn);
-        } catch (err) {
-          log.catch(err, { game });
-        }
-      }
-
-      model.initialize(chess.fen());
-    }
-  }, [game.pgn]);
-
-  const space = getSpace(game);
-  if (!space) {
-    return null;
-  }
-
-  const handleDrop = useCallback<NonNullable<BoardRootProps['onDrop']>>(
-    (move) => {
-      if (model.makeMove(move)) {
-        game.pgn = model.game.pgn();
-        game.fen = model.game.fen();
-        return true;
-      }
-
-      return false;
-    },
-    [model],
-  );
-
-  return (
-    <Board.Root model={model} onDrop={handleDrop}>
-      <Chessboard />
-    </Board.Root>
-  );
-};

package/src/components/ChessContainer.tsx

@@ -1,35 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React from 'react';
-
-import { getSpace } from '@dxos/react-client/echo';
-import { StackItem } from '@dxos/react-ui-stack';
-
-import { ChessComponent } from './ChessComponent';
-import { PlayerSelector } from './PlayerSelector';
-import { type ChessType } from '../types';
-
-const ChessContainer = ({ game }: { game: ChessType; role?: string }) => {
-  const space = getSpace(game);
-  if (!space) {
-    return null;
-  }
-
-  return (
-    <StackItem.Content>
-      <div role='none' className='grid grid-rows-[60px_1fr_60px] grow overflow-hidden'>
-        <div />
-
-        <div className='flex m-4 overflow-hidden'>
-          <ChessComponent game={game} />
-        </div>
-
-        <PlayerSelector space={space} game={game} />
-      </div>
-    </StackItem.Content>
-  );
-};
-
-export default ChessContainer;

package/src/components/ChessPanel.tsx

@@ -1,67 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { ArrowURightDown, Circle } from '@phosphor-icons/react';
-import { type Color } from 'chess.js';
-import React, { type FC } from 'react';
-
-import { type ThemedClassName } from '@dxos/react-ui';
-import { type ChessModel } from '@dxos/react-ui-gameboard';
-import { getSize, mx } from '@dxos/react-ui-theme';
-
-export type ChessPanelProps = ThemedClassName<{
-  model: ChessModel;
-  orientation?: Color;
-  onFlip?: () => void;
-}>;
-
-export const ChessPanel: FC<ChessPanelProps> = ({ classNames, model, orientation = 'w', onFlip }) => {
-  const game = model.game;
-  const history = game.history();
-  const label = game.isGameOver()
-    ? game.isCheckmate()
-      ? 'CHECKMATE'
-      : game.isStalemate()
-        ? 'STALEMATE'
-        : 'DRAW'
-    : game.isCheck()
-      ? 'CHECK'
-      : history.length
-        ? `Move ${history.length}`
-        : '';
-
-  const Player = ({ color }: { color: Color }) => {
-    const turn = color === game.turn();
-
-    return (
-      <div className='flex items-center'>
-        <Circle
-          className={mx(getSize(4), turn && (game.isCheckmate() ? 'text-red-500' : 'text-green-500'))}
-          weight={turn ? 'fill' : 'thin'}
-        />
-      </div>
-    );
-  };
-
-  return (
-    <div className={mx('flex flex-col', classNames)}>
-      <div className='flex items-center justify-between pl-2 pr-2 border-b' style={{ height: 32 }}>
-        <Player color={orientation === 'w' ? 'b' : 'w'} />
-        {onFlip && (
-          <button onClick={onFlip}>
-            <ArrowURightDown weight='thin' className={getSize(6)} />
-          </button>
-        )}
-      </div>
-
-      <div className='flex flex-col justify-center pl-2 font-thin' style={{ height: 40 }}>
-        {label}
-      </div>
-
-      <div className='flex items-center justify-between pl-2 pr-2 border-t' style={{ height: 32 }}>
-        <Player color={orientation} />
-      </div>
-    </div>
-  );
-};

package/src/components/PlayerSelector.tsx

@@ -1,80 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { CrownCross } from '@phosphor-icons/react';
-import React from 'react';
-
-import { generateName } from '@dxos/display-name';
-import { useMembers, type Space, type SpaceMember } from '@dxos/react-client/echo';
-import { Input, Select, useThemeContext } from '@dxos/react-ui';
-import { getSize, mx } from '@dxos/react-ui-theme';
-
-import { type ChessType } from '../types';
-
-export const PlayerSelector = ({ space, game }: { space: Space; game: ChessType }) => {
-  const members = useMembers(space.key);
-
-  return (
-    <div role='none' className='grid grid-cols-2 gap-8'>
-      <div role='none' className='flex flex-row-reverse items-center gap-2'>
-        <PlayerSelect
-          side='white'
-          value={game.playerWhite}
-          onValueChange={(player) => (game.playerWhite = player)}
-          members={members}
-        />
-      </div>
-      <div role='none' className='flex flex-row items-center gap-2'>
-        <PlayerSelect
-          side='black'
-          value={game.playerBlack}
-          onValueChange={(player) => (game.playerBlack = player)}
-          members={members}
-        />
-      </div>
-    </div>
-  );
-};
-
-const PlayerSelect = ({
-  side,
-  value,
-  onValueChange,
-  members,
-}: {
-  side: 'white' | 'black';
-  value: string | undefined;
-  onValueChange: (player: string) => void;
-  members: SpaceMember[];
-}) => {
-  const { themeMode } = useThemeContext();
-  const iconFillMode =
-    (side === 'black' && themeMode === 'light') || (side === 'white' && themeMode === 'dark') ? 'fill' : undefined;
-
-  return (
-    <Input.Root>
-      <Input.Label>
-        <CrownCross className={mx(getSize(6))} weight={iconFillMode} aria-label={`Chess icon for side ${side}`} />
-      </Input.Label>
-      <Select.Root value={value} onValueChange={onValueChange}>
-        <Select.TriggerButton placeholder={'Select player'} />
-        <Select.Portal>
-          <Select.Content>
-            <Select.Viewport>
-              {members.map((member) => {
-                const memberKey = member.identity.identityKey.toHex();
-                const displayName = member.identity?.profile?.displayName || generateName(memberKey);
-                return (
-                  <Select.Option key={memberKey} value={memberKey}>
-                    {displayName}
-                  </Select.Option>
-                );
-              })}
-            </Select.Viewport>
-          </Select.Content>
-        </Select.Portal>
-      </Select.Root>
-    </Input.Root>
-  );
-};

package/src/types/schema.ts

@@ -1,34 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Schema } from 'effect';
-
-import { Type } from '@dxos/echo';
-
-export const MoveSchema = Schema.mutable(
-  Schema.partial(
-    Schema.Struct({
-      source: Schema.String,
-      target: Schema.String,
-      piece: Schema.String,
-    }),
-  ),
-);
-
-export const ChessType = Schema.Struct({
-  name: Schema.optional(Schema.String),
-  playerWhite: Schema.String,
-  playerBlack: Schema.String,
-  moves: Schema.mutable(Schema.Array(Schema.String)),
-  // TODO(wittjosiah): Remove. Redundant with moves.
-  pgn: Schema.String,
-  fen: Schema.String,
-}).pipe(
-  Schema.partial,
-  Type.Obj({
-    typename: 'dxos.org/type/Chess',
-    version: '0.1.0',
-  }),
-);
-export interface ChessType extends Schema.Schema.Type<typeof ChessType> {}

package/src/types/types.ts

@@ -1,26 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { Schema } from 'effect';
-
-import { Obj } from '@dxos/echo';
-
-import { ChessType } from './schema';
-import { CHESS_PLUGIN } from '../meta';
-
-export namespace ChessAction {
-  const CHESS_ACTION = `${CHESS_PLUGIN}/action`;
-
-  export class Create extends Schema.TaggedClass<Create>()(`${CHESS_ACTION}/create`, {
-    input: Schema.Struct({
-      name: Schema.optional(Schema.String),
-      fen: Schema.optional(Schema.String),
-    }),
-    output: Schema.Struct({
-      object: ChessType,
-    }),
-  }) {}
-}
-
-export const isObject = Obj.instanceOf(ChessType);