import 'package:flutter/material.dart';

import '../theme/focus_flow_tokens.dart';

class AppShell extends StatelessWidget {
  const AppShell({required this.sidebar, required this.child, super.key});

  final Widget sidebar;
  final Widget child;

  @override
  Widget build(BuildContext context) {
    return ColoredBox(
      color: FocusFlowTokens.appBackground,
      child: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(4),
          child: ClipRRect(
            borderRadius: BorderRadius.circular(FocusFlowTokens.appFrameRadius),
            child: DecoratedBox(
              decoration: BoxDecoration(
                color: FocusFlowTokens.appBackground,
                border: Border.all(color: FocusFlowTokens.appFrameBorder),
                borderRadius: BorderRadius.circular(
                  FocusFlowTokens.appFrameRadius,
                ),
              ),
              child: Row(
                children: [
                  SizedBox(width: FocusFlowTokens.sidebarWidth, child: sidebar),
                  const VerticalDivider(
                    width: 1,
                    thickness: 1,
                    color: FocusFlowTokens.subtleBorder,
                  ),
                  Expanded(child: child),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}