Hi Currently in the midst of migration

Hi ! Currently in the midst of migration

       <Authenticated fallback={<CatchAllNavigate to="/auth/login" />}>
            <ThemedLayoutV2
                Header={() => <Header />}
                Sider={() => <ThemedSiderV2 fixed />}
                Title={({ collapsed }) => (
                    <ThemedTitleV2
                        collapsed={collapsed}
                        text="Renta Car"
                        icon={<TeamOutlined />}
                    />
                )}
            >
                <Suspense fallback={<Skeleton active paragraph={{ rows: 14, width: "85%" }} />}>
                    <Outlet />
                </Suspense>
            </ThemedLayoutV2>
        </Authenticated>

       <Authenticated fallback={<CatchAllNavigate to="/auth/login" />}>
            <ThemedLayoutV2
                Header={() => <Header />}
                Sider={() => <ThemedSiderV2 fixed />}
                Title={({ collapsed }) => (
                    <ThemedTitleV2
                        collapsed={collapsed}
                        text="Renta Car"
                        icon={<TeamOutlined />}
                    />
                )}
            >
                <Suspense fallback={<Skeleton active paragraph={{ rows: 14, width: "85%" }} />}>
                    <Outlet />
                </Suspense>
            </ThemedLayoutV2>
        </Authenticated>

i am trying to updated the text but it aint working for some reason. Now when I pass the depercated Title prop to Refine component it works for some reason

4 Replies

unwilling-turquoise•16mo ago

you can use like

 <ThemedLayoutV2
                    Sider={() => (
                      <ThemedSiderV2
                        Title={({ collapsed }) => (
                          <ThemedTitleV2
                            collapsed={collapsed}
                            text="Renta Car"
                          />
                        )}
                      />
                    )}>
        <Outlet />
</ThemedLayoutV2>

 <ThemedLayoutV2
                    Sider={() => (
                      <ThemedSiderV2
                        Title={({ collapsed }) => (
                          <ThemedTitleV2
                            collapsed={collapsed}
                            text="Renta Car"
                          />
                        )}
                      />
                    )}>
        <Outlet />
</ThemedLayoutV2>

you are giving Title after that overriding Sider, so your Title is not used in that case

genetic-orange•16mo ago

it works ! thanks another thing, can I use css modules with refine ?

unwilling-turquoise•16mo ago

yes, of course

genetic-orange•16mo ago

thanks