fluffychat/lib/widgets/layouts/two_column_layout.dart

import 'package:flutter/material.dart';

import 'package:vrouter/vrouter.dart';

/// displays a two-column layout with some FluffyChat specific patches
///
/// On huge screens width > 1024, the navigation rail for quick navigation is
/// rendered surround
class FluffyChatTwoColumnLayout extends StatelessWidget {
  final Widget mainView;
  final Widget sideView;

  const FluffyChatTwoColumnLayout({
    Key? key,
    required this.mainView,
    required this.sideView,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ScaffoldMessenger(
      child: Scaffold(
        body: LayoutBuilder(builder: (context, constraints) {
          final columnWidth = context.vRouter.path.startsWith('/rooms') &&
                  constraints.maxWidth > 1024
              ? 360.0 + 64
              : 360.0;

          return Row(
            children: [
              Container(
                clipBehavior: Clip.antiAlias,
                decoration: const BoxDecoration(),
                width: columnWidth,
                child: mainView,
              ),
              Container(
                width: 1.0,
                color: Theme.of(context).dividerColor,
              ),
              Expanded(
                child: ClipRRect(
                  child: sideView,
                ),
              ),
            ],
          );
        }),
      ),
    );
  }
}