Skip to content

Commit

Permalink
Improve design of leave/delete group buttons (#1250)
Browse files Browse the repository at this point in the history 
| Before | After |
|--------|--------|
|
![image](https://github.com/SharezoneApp/sharezone-app/assets/24459435/cc7a669e-e912-4e47-b793-e1f7725b8518)
|
![image](https://github.com/SharezoneApp/sharezone-app/assets/24459435/711433d3-dac3-4a8d-a365-020752488c40)
|

## Dark Mode

| Desktop | Mobile |
|--------|--------|
| ![Screenshot 2024-01-12 at 20 57
31](https://github.com/SharezoneApp/sharezone-app/assets/24459435/375baebf-d669-4f21-90cd-b4771dc72fe6)
| ![Screenshot 2024-01-12 at 20 57
26](https://github.com/SharezoneApp/sharezone-app/assets/24459435/1c02b5a5-5df1-40a2-ba8f-91c8ba54f7e5)
|


Also refactored the code to avoid code duplication.
  • Loading branch information
@nilsreichardt
nilsreichardt authored Jan 13, 2024
1 parent 76d4e02 commit 83bdf89
Show file tree
Hide file tree
Showing 3 changed files with 230 additions and 149 deletions.
154 changes: 68 additions & 86 deletions app/lib/groups/src/pages/course/course_details.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import 'package:app_functions/app_functions_ui.dart';
import 'package:bloc_provider/bloc_provider.dart';
import 'package:flutter/material.dart';
import 'package:group_domain_models/group_domain_models.dart';
import 'package:sharezone/groups/src/widgets/danger_section.dart';
import 'package:sharezone/main/application_bloc.dart';
import 'package:sharezone/groups/analytics/group_analytics.dart';
import 'package:sharezone/groups/src/pages/course/course_card.dart';
Expand Down Expand Up @@ -178,21 +179,18 @@ class _CourseDetailsPage extends StatelessWidget {
);
},
),
SafeArea(
bottom: !isAdmin,
child: _LeaveCourseButton(
onDialogClose: (appFunction) => Navigator.pop(
context,
LeaveCourseDetailsPopOption(appFunction),
),
_DangerSection(
onDeleteDialogClose: (appFunction) => Navigator.pop(
context,
DeleteCourseDetailsPopOption(appFunction),
),
),
if (isAdmin)
_DeleteCourseButton(
onDialogClose: (appFunction) => Navigator.pop(context,
DeleteCourseDetailsPopOption(appFunction)),
courseName: course.name,
onLeaveDialogClose: (appFunction) => Navigator.pop(
context,
LeaveCourseDetailsPopOption(appFunction),
),
isAdmin: isAdmin,
courseName: course.name,
),
],
),
),
Expand All @@ -205,6 +203,63 @@ class _CourseDetailsPage extends StatelessWidget {
}
}

class _DangerSection extends StatelessWidget {
const _DangerSection({
required this.onDeleteDialogClose,
required this.onLeaveDialogClose,
required this.isAdmin,
required this.courseName,
});

final Function(Future<AppFunctionsResult<bool>>) onDeleteDialogClose;
final Function(Future<AppFunctionsResult<bool>>) onLeaveDialogClose;
final bool isAdmin;
final String courseName;

void _logCourseLeaveButtonViaCourseDetailsPage(Analytics analytics) {
analytics.log(NamedAnalyticsEvent(
name: "course_leave_button_via_course_details_page"));
}

void _logCourseDeleteButtonViaCourseDetailsPage(Analytics analytics) {
analytics.log(NamedAnalyticsEvent(
name: "course_delete_button_via_course_details_page"));
}

@override
Widget build(BuildContext context) {
return DangerSection(
deleteButtonLabel: const Text("KURS LÖSCHEN"),
onPressedDeleteButton: () async {
final bloc = BlocProvider.of<CourseDetailsBloc>(context);
final analytics = BlocProvider.of<SharezoneContext>(context).analytics;

_logCourseDeleteButtonViaCourseDetailsPage(analytics);
final result = await showDeleteCourseDialog(context, courseName);

if (result == true) {
onDeleteDialogClose(bloc.deleteCourse());
}
},
leaveButtonLabel: const Text("KURS VERLASSEN"),
onPressedLeaveButton: () async {
final bloc = BlocProvider.of<CourseDetailsBloc>(context);
final analytics = BlocProvider.of<SharezoneContext>(context).analytics;

_logCourseLeaveButtonViaCourseDetailsPage(analytics);
final isLastMember = (await bloc.members.first).length <= 1;
if (!context.mounted) return;
final result = await showCourseLeaveDialog(context, isLastMember);

if (result == true) {
onLeaveDialogClose(bloc.leaveCourse());
}
},
hasDeleteButton: isAdmin,
);
}
}

class _ChangeColorIcon extends StatelessWidget {
const _ChangeColorIcon({required this.courseID});

Expand Down Expand Up @@ -243,79 +298,6 @@ class _EditIcon extends StatelessWidget {
}
}

class _LeaveCourseButton extends StatelessWidget {
const _LeaveCourseButton({
required this.onDialogClose,
});

final Function(Future<AppFunctionsResult<bool>>) onDialogClose;

@override
Widget build(BuildContext context) {
final bloc = BlocProvider.of<CourseDetailsBloc>(context);
final analytics = BlocProvider.of<SharezoneContext>(context).analytics;
return Padding(
padding: const EdgeInsets.only(bottom: 12),
child: DestroyButton(
title: const Text("KURS VERLASSEN"),
color: const Color(0xFFff7d7d),
onTap: () async {
_logCourseLeaveButtonViaCourseDetailsPage(analytics);
final isLastMember = (await bloc.members.first).length <= 1;
if (!context.mounted) return;
final result = await showCourseLeaveDialog(context, isLastMember);
if (result == true) {
onDialogClose(bloc.leaveCourse());
}
},
),
);
}

void _logCourseLeaveButtonViaCourseDetailsPage(Analytics analytics) {
analytics.log(NamedAnalyticsEvent(
name: "course_leave_button_via_course_details_page"));
}
}

class _DeleteCourseButton extends StatelessWidget {
const _DeleteCourseButton({
required this.onDialogClose,
required this.courseName,
});

final Function(Future<AppFunctionsResult<bool>>) onDialogClose;
final String courseName;

@override
Widget build(BuildContext context) {
final bloc = BlocProvider.of<CourseDetailsBloc>(context);
final analytics = BlocProvider.of<SharezoneContext>(context).analytics;
return SafeArea(
bottom: true,
child: Padding(
padding: const EdgeInsets.only(bottom: 12),
child: DestroyButton(
title: const Text("KURS LÖSCHEN"),
onTap: () async {
_logCourseDeleteButtonViaCourseDetailsPage(analytics);
final result = await showDeleteCourseDialog(context, courseName);
if (result == true) {
final deleteCourseFunction = bloc.deleteCourse();
onDialogClose(deleteCourseFunction);
}
},
),
),
);
}

void _logCourseDeleteButtonViaCourseDetailsPage(Analytics analytics) {
analytics.log(NamedAnalyticsEvent(
name: "course_delete_button_via_course_details_page"));
}
}

class HelpCoursePageIconButton extends StatelessWidget {
const HelpCoursePageIconButton({super.key});

Expand Down
111 changes: 48 additions & 63 deletions app/lib/groups/src/pages/school_class/school_class_details.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import 'package:sharezone/groups/src/pages/school_class/edit/school_class_edit_p
import 'package:sharezone/groups/src/pages/school_class/my_school_class_bloc.dart';
import 'package:sharezone/groups/src/pages/school_class/school_class_details/school_class_member_option.dart';
import 'package:sharezone/groups/src/pages/school_class/school_class_page.dart';
import 'package:sharezone/groups/src/widgets/danger_section.dart';
import 'package:sharezone/groups/src/widgets/group_share.dart';
import 'package:sharezone/groups/src/widgets/member_section.dart';
import 'package:sharezone/groups/src/widgets/sharecode_text.dart';
Expand Down Expand Up @@ -112,17 +113,17 @@ class SchoolClassDetailsPage extends StatelessWidget {
);
},
),
SafeArea(
bottom: !isAdmin,
child: _LeaveSchoolClassButton(
onDialogClose: (appFunction) => Navigator.pop(context,
LeaveSchoolClassDetailsPopOption(appFunction)),
_DangerSection(
onDeleteDialogClose: (appFunction) => Navigator.pop(
context,
DeleteSchoolClassDetailsPopOption(appFunction),
),
),
if (isAdmin)
_DeleteSchoolClassButton(
onDialogClose: (appFunction) => Navigator.pop(context,
DeleteSchoolClassDetailsPopOption(appFunction))),
onLeaveDialogClose: (appFunction) => Navigator.pop(
context,
LeaveSchoolClassDetailsPopOption(appFunction),
),
isAdmin: isAdmin,
)
],
);
},
Expand All @@ -133,75 +134,59 @@ class SchoolClassDetailsPage extends StatelessWidget {
}
}

class _EditIcon extends StatelessWidget {
const _EditIcon({
required this.schoolClass,
class _DangerSection extends StatelessWidget {
const _DangerSection({
required this.isAdmin,
required this.onDeleteDialogClose,
required this.onLeaveDialogClose,
});

final SchoolClass schoolClass;
final bool isAdmin;
final Function(Future<AppFunctionsResult<bool>>) onDeleteDialogClose;
final Function(Future<AppFunctionsResult<bool>>) onLeaveDialogClose;

@override
Widget build(BuildContext context) {
return IconButton(
tooltip: 'Bearbeiten',
icon: const Icon(Icons.edit),
onPressed: () => openSchoolClassEditPage(context, schoolClass),
);
}
}
return DangerSection(
deleteButtonLabel: const Text("KLASSE LÖSCHEN"),
onPressedDeleteButton: () async {
final bloc = BlocProvider.of<MySchoolClassBloc>(context);

class _LeaveSchoolClassButton extends StatelessWidget {
const _LeaveSchoolClassButton({
required this.onDialogClose,
});

final Function(Future<AppFunctionsResult<bool>>) onDialogClose;
final schoolClassDeleteType =
await showDeleteSchoolClassDialog(context);
if (schoolClassDeleteType != null) {
final deleteFuture = bloc.deleteSchoolClass(schoolClassDeleteType);
onLeaveDialogClose(deleteFuture);
}
},
leaveButtonLabel: const Text("KLASSE VERLASSEN"),
onPressedLeaveButton: () async {
final bloc = BlocProvider.of<MySchoolClassBloc>(context);

@override
Widget build(BuildContext context) {
final bloc = BlocProvider.of<MySchoolClassBloc>(context);
return Padding(
padding: const EdgeInsets.only(bottom: 12),
child: DestroyButton(
color: const Color(0xFFff7d7d),
title: const Text("KLASSE VERLASSEN"),
onTap: () async {
final confirmed = await showLeaveSchoolClassDialog(context);
if (confirmed == true) {
onDialogClose(bloc.leaveSchoolClass());
}
},
),
final confirmed = await showLeaveSchoolClassDialog(context);
if (confirmed == true) {
final leaveFuture = bloc.leaveSchoolClass();
onLeaveDialogClose(leaveFuture);
}
},
hasDeleteButton: isAdmin,
);
}
}

class _DeleteSchoolClassButton extends StatelessWidget {
const _DeleteSchoolClassButton({
required this.onDialogClose,
class _EditIcon extends StatelessWidget {
const _EditIcon({
required this.schoolClass,
});

final Function(Future<AppFunctionsResult<bool>>) onDialogClose;
final SchoolClass schoolClass;

@override
Widget build(BuildContext context) {
final bloc = BlocProvider.of<MySchoolClassBloc>(context);
return SafeArea(
bottom: true,
child: Padding(
padding: const EdgeInsets.only(bottom: 12),
child: DestroyButton(
title: const Text("KLASSE LÖSCHEN"),
color: Colors.redAccent,
onTap: () async {
final schoolClassDeleteType =
await showDeleteSchoolClassDialog(context);
if (schoolClassDeleteType != null) {
onDialogClose(bloc.deleteSchoolClass(schoolClassDeleteType));
}
},
),
),
return IconButton(
tooltip: 'Bearbeiten',
icon: const Icon(Icons.edit),
onPressed: () => openSchoolClassEditPage(context, schoolClass),
);
}
}
Expand Down
Loading

0 comments on commit 83bdf89

Please sign in to comment.