✨ widget usefull through the app such as custom button

client/lib/widget/custombutton.widget.dart

@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+
+class CustomButtonWidget extends StatefulWidget {
+  const CustomButtonWidget(
+      {required this.onPressed,
+      required this.message,
+      required this.color,
+      super.key});
+  final Function()? onPressed;
+  final String message;
+  final Color color;
+  @override
+  State<CustomButtonWidget> createState() => _CustomButtonWidgetState();
+}
+
+class _CustomButtonWidgetState extends State<CustomButtonWidget> {
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+        onTap: widget.onPressed,
+        child: ClipRRect(
+          borderRadius: BorderRadius.circular(5),
+          child: Container(
+            height: 50,
+            width: MediaQuery.of(context).size.width,
+            alignment: Alignment.center,
+            color: widget.color,
+            child: Text(widget.message,
+                style: const TextStyle(
+                  color: Colors.white,
+                  fontWeight: FontWeight.w900,
+                )),
+          ),
+        ));
+  }
+}

client/lib/widget/profilepic.dart

@@ -0,0 +1,65 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:discord/model/user.model.dart';
+import 'package:flutter/material.dart';
+
+class ProfilePic extends StatelessWidget {
+  final User userData;
+  const ProfilePic({super.key, required this.userData});
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      alignment: Alignment.bottomRight,
+      children: <Widget>[
+        ClipRRect(
+            borderRadius: BorderRadius.circular(100),
+            child: Container(
+                width: 90,
+                height: 90,
+                color: const Color.fromARGB(255, 26, 24, 24),
+                padding: const EdgeInsets.all(7),
+                alignment: Alignment.center,
+                child: ClipRRect(
+                    borderRadius: BorderRadius.circular(100),
+                    child: CachedNetworkImage(
+                        height: 90,
+                        width: 90,
+                        imageUrl: userData.profilePic)))),
+        Padding(
+          padding: const EdgeInsets.all(9),
+          child: userData.status == 'Inactive'
+              ? const Icon(
+                  Icons.mode_night_sharp,
+                  color: Colors.orange,
+                  size: 18,
+                )
+              : userData.status == 'Do not disturb'
+                  ? Container(
+                      decoration: const BoxDecoration(
+                          color: Colors.red, shape: BoxShape.circle),
+                      height: 18,
+                      width: 18,
+                      alignment: Alignment.center,
+                      child: Container(
+                        height: 3,
+                        width: 12,
+                        color: Colors.black,
+                      ))
+                  : userData.status != 'Online'
+                      ? Container(
+                          decoration: const BoxDecoration(
+                              color: Colors.grey, shape: BoxShape.circle),
+                          height: 18,
+                          width: 18,
+                        )
+                      : Container(
+                          decoration: const BoxDecoration(
+                              color: Colors.green, shape: BoxShape.circle),
+                          height: 18,
+                          width: 18,
+                        ),
+        )
+      ],
+    );
+  }
+}

client/lib/widget/textfield.widget.dart

@@ -0,0 +1,69 @@
+import 'package:flutter/material.dart';
+
+class TextFieldWidget extends StatefulWidget {
+  const TextFieldWidget(
+      {required this.textEditingController,
+      required this.hint,
+      required this.color,
+      super.key});
+  final TextEditingController textEditingController;
+  final String hint;
+  final Color color;
+  @override
+  State<TextFieldWidget> createState() => _TextFieldWidgetState();
+}
+
+class _TextFieldWidgetState extends State<TextFieldWidget> {
+  @override
+  Widget build(BuildContext context) {
+    return ClipRRect(
+      borderRadius: BorderRadius.circular(5),
+      child: Container(
+        height: 70,
+        alignment: Alignment.center,
+        width: MediaQuery.of(context).size.width,
+        color: widget.color,
+        child: TextField(
+          cursorColor: const Color.fromARGB(255, 127, 99, 252),
+          keyboardAppearance: Brightness.dark,
+          controller: widget.textEditingController,
+          keyboardType: TextInputType.emailAddress,
+          style: const TextStyle(
+            color: Colors.white,
+            fontStyle: FontStyle.normal,
+            fontWeight: FontWeight.normal,
+          ),
+          decoration: InputDecoration(
+            contentPadding: const EdgeInsets.only(left: 20.0, top: 5),
+            labelText: widget.hint,
+            hintText: widget.hint,
+            labelStyle: const TextStyle(
+              color: Colors.grey,
+              fontSize: 14.0,
+              fontWeight: FontWeight.w600,
+            ),
+            hintStyle: const TextStyle(
+              color: Colors.white,
+              fontSize: 14.0,
+              fontWeight: FontWeight.w600,
+            ),
+            enabledBorder: OutlineInputBorder(
+              borderSide:
+                  const BorderSide(color: Colors.transparent, width: 1.5),
+              borderRadius: BorderRadius.circular(10.0),
+            ),
+            floatingLabelStyle: const TextStyle(
+              color: Colors.white,
+              fontSize: 18.0,
+            ),
+            focusedBorder: OutlineInputBorder(
+              borderSide:
+                  const BorderSide(color: Colors.transparent, width: 1.5),
+              borderRadius: BorderRadius.circular(10.0),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}