import dash
import dash_bootstrap_components as dbc
from dash import dcc
from dash import Input, Output, State, html
import plotly.express as px
import pandas as pd
import numpy as np
keyword = 'Socks'
df = pd.read_csv('ice socks.csv')
app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])
app.layout = dbc.Container([
 dbc.Row([
 dbc.Col(html.Div(
 [
 dbc.Button("Open Offcanvas",
 id="open-offcanvas", n_clicks=0),
 dbc.Offcanvas(
 dcc.Dropdown(id='Ratings22', multi=True, value='5',
 options=[
 {'label': x, 'value': x}
 for x in sorted(df['Rating'].unique())
 ]),
 id="offcanvas",
 title="Title",
 is_open=False,
 ),
 ]
 ), width={'size': 2, 'offset': 10})
 ]),
 dbc.Row([
 dbc.Col(html.H1(f'Dashboard for suppliers that sell {keyword}',
 className='text-center font-weight-bold text-primary'))
 ]),
 dbc.Row([
 dbc.Col([
 dcc.Dropdown(id='Ratings', multi=True, value='5',
 options=[
 {'label': x, 'value': x}
 for x in sorted(df['Rating'].unique())
 ]),
 dcc.Graph(id='Ratings_fig', figure={})
 ],
 width={'size': 5}),
 dbc.Col([
 dcc.Dropdown(id='Reviews', multi=True, value='',
 options=[
 {'label': y, 'value': y}
 for y in sorted(df['Number of Reviews'].unique())]),
 dcc.Graph(id='Reviews_fig', figure={})
 ], width={'size': 5, 'offset': 2})
 ]),
 dbc.Row([
 ])
], fluid=False)
@app.callback(
 Output("offcanvas", "is_open"),
 Input("open-offcanvas", "n_clicks"),
 [State("offcanvas", "is_open")],
)
def toggle_offcanvas(n1, is_open):
 if n1:
 return not is_open
 return is_open
@app.callback(
 [Output('Ratings_fig', 'figure'),
 Output('Reviews_fig', 'figure')],
 [Input('Ratings', 'value'),
 Input('Reviews', 'value')]
)
def update_graph(rating_selected, reviews_selected):
 df_ratings = df.copy()
 df_ratings = df_ratings[['Rating'] == rating_selected]
 df_reviews = df.copy()
 df_reviews = df_reviews[['Number of Reviews']
 == reviews_selected]
 df_ratings = df_ratings.groupby(
 ['Rating'])['Rating'].count().reset_index(name='rating_count')
 ratings_fig = px.pie(df_ratings, values='rating_count', names='Rating',
 title='Rating Distribution')
 df_reviews = pd.DataFrame(df_reviews, columns=['Number of Reviews'])
 # changing the data of this column so that they are rounded to the nearest 100
 df_reviews['Number of Reviews'] = np.round(
 df_reviews['Number of Reviews'], decimals=-2)
 df_reviews = df_reviews.groupby(['Number of Reviews'])[
 'Number of Reviews'].count().reset_index(name='rev_count') # grouping the review numbers and counting, and naming the column
 reviews_fig = px.pie(df_reviews, values='rev_count', names='Number of Reviews',
 title='Number of Reviews Distribution')
 return ratings_fig, reviews_fig
if __name__ == "__main__":
 app.run_server(debug=True)