hunk.code_window:   return {
       position: 'absolute',
       right: '6px',
       bottom: '6px',
       ':hover': {
         background: theme.colors.pageBackground,
       },
  
hunk.labels: keep keep keep add keep keep keep
hunk.after_edit:     opacity: 0,
       pointerEvents: 'none',
       transition: 'all .15s',
  
hunk.file_path: apps/web/src/components/pure/workspace-card/styles.ts
hunk.type: add
file: import { useSetAtom } from 'jotai';
  import { useCallback } from 'react';
  
  import { jotaiWorkspacesAtom } from '../atoms';
  import { WorkspacePlugins } from '../plugins';
  import { FlavourToWorkspace, RemWorkspaceFlavour } from '../shared';
  
  /**
   * Transform workspace from one flavour to another
   *
   * The logic here is to delete the old workspace and create a new one.
   */
  export function useTransformWorkspace() {
    const set = useSetAtom(jotaiWorkspacesAtom);
    return useCallback(
      async <From extends RemWorkspaceFlavour, To extends RemWorkspaceFlavour>(
        from: From,
        to: To,
        workspace: FlavourToWorkspace[From]
      ): Promise<string> => {
        await WorkspacePlugins[from].CRUD.delete(workspace as any);
        const newId = await WorkspacePlugins[to].CRUD.create(
          workspace.blockSuiteWorkspace
        );
        set(workspaces => {
          const idx = workspaces.findIndex(ws => ws.id === workspace.id);
          workspaces.splice(idx, 1, {
            id: newId,
            flavour: to,
          });
          return [...workspaces];
        });
        return newId;
      },
      [set]
    );
  }
  