hunk.code_window:     const { workspace_id } = useParams();
       const { user } = useUserAndSpaces();
       useEffect(() => {
           const navigate_to_user_initial_page = async () => {
               const recent_pages = await services.api.userConfig.getRecentPages(
                   workspace_id,
                   user.id
               );
               const user_initial_page_id =
                   await services.api.userConfig.getUserInitialPage(
                       workspace_id,
                       user.id
  
hunk.labels: keep keep keep keep keep replace replace replace replace replace replace replace keep keep
hunk.after_edit:             const [recent_pages, user_initial_page_id] = await Promise.all([
                   services.api.userConfig.getRecentPages(workspace_id, user.id),
                   services.api.userConfig.getUserInitialPage(
  
hunk.file_path: apps/ligo-virgo/src/pages/workspace/Home.tsx
hunk.type: replace
file: /* eslint-disable @typescript-eslint/no-non-null-assertion */
  import { Utils } from '@tldraw/core';
  import {
      DistributeType,
      TDShape,
      TldrawCommand,
      TDShapeType,
  } from '@toeverything/components/board-types';
  import { TLDR } from '@toeverything/components/board-state';
  import Vec from '@tldraw/vec';
  import type { TldrawApp } from '@toeverything/components/board-state';
  
  export function distributeShapes(
      app: TldrawApp,
      ids: string[],
      type: DistributeType
  ): TldrawCommand {
      const { currentPageId } = app;
  
      const initialShapes = ids.map(id => app.getShape(id));
  
      const deltaMap = Object.fromEntries(
          getDistributions(initialShapes, type).map(d => [d.id, d])
      );
  
      const { before, after } = TLDR.mutate_shapes(
          app.state,
          ids.filter(id => deltaMap[id] !== undefined),
          shape => ({ point: deltaMap[shape.id].next }),
          currentPageId
      );
  
      initialShapes.forEach(shape => {
          if (shape.type === TDShapeType.Group) {
              const delta = Vec.sub(
                  after[shape.id].point!,
                  before[shape.id].point!
              );
  
              shape.children.forEach(id => {
                  const child = app.getShape(id);
                  before[child.id] = { point: child.point };
                  after[child.id] = { point: Vec.add(child.point, delta) };
              });
  
              delete before[shape.id];
              delete after[shape.id];
          }
      });
  
      return {
          id: 'distribute',
          before: {
              document: {
                  pages: {
                      [currentPageId]: { shapes: before },
                  },
                  pageStates: {
                      [currentPageId]: {
                          selectedIds: ids,
                      },
                  },
              },
          },
          after: {
              document: {
                  pages: {
                      [currentPageId]: { shapes: after },
                  },
                  pageStates: {
                      [currentPageId]: {
                          selectedIds: ids,
                      },
                  },
              },
          },
      };
  }
  
  function getDistributions(initialShapes: TDShape[], type: DistributeType) {
      const entries = initialShapes.map(shape => {
          const utils = TLDR.get_shape_util(shape);
          return {
              id: shape.id,
              point: [...shape.point],
              bounds: utils.getBounds(shape),
              center: utils.getCenter(shape),
          };
      });
  
      const len = entries.length;
      const commonBounds = Utils.getCommonBounds(
          entries.map(({ bounds }) => bounds)
      );
  
      const results: { id: string; prev: number[]; next: number[] }[] = [];
  
      switch (type) {
          case DistributeType.Horizontal: {
              const span = entries.reduce((a, c) => a + c.bounds.width, 0);
  
              if (span > commonBounds.width) {
                  const left = entries.sort(
                      (a, b) => a.bounds.minX - b.bounds.minX
                  )[0];
  
                  const right = entries.sort(
                      (a, b) => b.bounds.maxX - a.bounds.maxX
                  )[0];
  
                  const entriesToMove = entries
                      .filter(a => a !== left && a !== right)
                      .sort((a, b) => a.center[0] - b.center[0]);
  
                  const step = (right.center[0] - left.center[0]) / (len - 1);
  
                  const x = left.center[0] + step;
  
                  entriesToMove.forEach(({ id, point, bounds }, i) => {
                      results.push({
                          id,
                          prev: point,
                          next: [x + step * i - bounds.width / 2, bounds.minY],
                      });
                  });
              } else {
                  const entriesToMove = entries.sort(
                      (a, b) => a.center[0] - b.center[0]
                  );
  
                  let x = commonBounds.minX;
                  const step = (commonBounds.width - span) / (len - 1);
  
                  entriesToMove.forEach(({ id, point, bounds }) => {
                      results.push({ id, prev: point, next: [x, bounds.minY] });
                      x += bounds.width + step;
                  });
              }
              break;
          }
          case DistributeType.Vertical: {
              const span = entries.reduce((a, c) => a + c.bounds.height, 0);
  
              if (span > commonBounds.height) {
                  const top = entries.sort(
                      (a, b) => a.bounds.minY - b.bounds.minY
                  )[0];
  
                  const bottom = entries.sort(
                      (a, b) => b.bounds.maxY - a.bounds.maxY
                  )[0];
  
                  const entriesToMove = entries
                      .filter(a => a !== top && a !== bottom)
                      .sort((a, b) => a.center[1] - b.center[1]);
  
                  const step = (bottom.center[1] - top.center[1]) / (len - 1);
  
                  const y = top.center[1] + step;
  
                  entriesToMove.forEach(({ id, point, bounds }, i) => {
                      results.push({
                          id,
                          prev: point,
                          next: [bounds.minX, y + step * i - bounds.height / 2],
                      });
                  });
              } else {
                  const entriesToMove = entries.sort(
                      (a, b) => a.center[1] - b.center[1]
                  );
  
                  let y = commonBounds.minY;
                  const step = (commonBounds.height - span) / (len - 1);
  
                  entriesToMove.forEach(({ id, point, bounds }) => {
                      results.push({ id, prev: point, next: [bounds.minX, y] });
                      y += bounds.height + step;
                  });
              }
  
              break;
          }
      }
  
      return results;
  }
  