Skip to content

Commit 2ea65a9

Browse files
Merge branch 'development' into users/nitin/bug-2019-component-select-list-search-result-issue
2 parents c7450d4 + 2a7acec commit 2ea65a9

File tree

5 files changed

+55
-62
lines changed

5 files changed

+55
-62
lines changed

.storybook/preview.tsx

Lines changed: 13 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,16 @@
11
import { Preview } from "@storybook/react"; // Import the 'Story' component
22
import React from 'react';
3-
import { MemoryRouter, Routes, Route } from 'react-router-dom';
43
import 'bootstrap/dist/css/bootstrap.min.css';
54
import 'bootstrap/dist/js/bootstrap.bundle';
65
import '../raaghu-react-themes/src/styles/default.scss';
76
import { themes } from '@storybook/theming';
8-
7+
98
// Helper function to apply the theme class to the document's body
109
const applyTheme = (theme) => {
1110
document.body.classList.remove('theme-light', 'theme-dark');
1211
document.body.classList.add(theme === 'dark' ? 'theme-dark' : 'theme-light');
1312
};
14-
13+
1514
// Storybook configuration
1615
const preview: Preview = {
1716
parameters: {
@@ -40,26 +39,20 @@ const preview: Preview = {
4039
{ value: 'light', title: 'light' },
4140
{ value: 'dark', title: 'dark' },
4241
],
43-
showName: true,
42+
showName: true,
43+
// dynamicTitle: true, // Use dynamic titles for buttons
4444
},
4545
},
4646
},
4747
};
48-
49-
// Single decorator that handles both theme and routing
50-
const withThemeAndRouter = (Story: React.FC, context: any) => {
51-
const selectedTheme = context.globals.theme;
52-
applyTheme(selectedTheme);
53-
54-
return (
55-
<MemoryRouter>
56-
<Routes>
57-
<Route path="/*" element={<Story />} />
58-
</Routes>
59-
</MemoryRouter>
60-
);
48+
49+
// Decorator to apply the theme dynamically
50+
const withTheme = (Story: React.FC, context: any) => { // Specify the type of 'Story' and 'context'
51+
const selectedTheme = context.globals.theme; // Get the current selected theme
52+
applyTheme(selectedTheme); // Apply the selected theme
53+
return <Story/>;
6154
};
62-
63-
export const decorators = [withThemeAndRouter];
64-
55+
56+
export const decorators = [withTheme];
57+
6558
export default preview;

raaghu-components/src/rds-comp-premium-support/rds-comp-premium-support.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ const RdsCompPremiumSupport = (props: RdsCompPremiumSupportProps) => {
106106
label={true}
107107
labelPosition={LabelPosition.Top}
108108
placeholder="Enter Name"
109-
// required
109+
required
110110
size={InputSize.Medium}
111111
value={premiumSupportData?.name}
112112
onChange={(e: any) => {
@@ -122,7 +122,7 @@ const RdsCompPremiumSupport = (props: RdsCompPremiumSupportProps) => {
122122
label={true}
123123
labelPosition={LabelPosition.Top}
124124
placeholder="Enter Email"
125-
// required
125+
required
126126
size={InputSize.Medium}
127127
value={premiumSupportData?.email}
128128
onChange={(e: any) => {
@@ -157,6 +157,8 @@ const RdsCompPremiumSupport = (props: RdsCompPremiumSupportProps) => {
157157
label="Message"
158158
isMandatory
159159
placeholder="Enter your extra message about your invoice"
160+
value={premiumSupportData?.message}
161+
onChange={(value: any) => handlePremiumSupportDataChanges(value, "message")}
160162
/>
161163
</div>
162164

@@ -182,7 +184,7 @@ const RdsCompPremiumSupport = (props: RdsCompPremiumSupportProps) => {
182184
tooltipTitle={""}
183185
type={"submit"}
184186
databsdismiss="offcanvas"
185-
isDisabled={!premiumSupportData.phoneNumber || !premiumSupportData.message}
187+
isDisabled={!premiumSupportData.phoneNumber || !premiumSupportData.message || !premiumSupportData.name || !premiumSupportData.email}
186188
onClick={(e: any) => emitSaveData(e)}
187189
></RdsButton>
188190
</div>

raaghu-elements/src/rds-text-editor/rds-text-editor.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,10 +41,11 @@ const RdsTextEditor = (props: RdsTextEditorProps) => {
4141
}, [props.value, props.showTitle]);
4242

4343
const handleChange = (value: string, delta: any, source: any, editor: any) => {
44-
setValue(value);
44+
const normalizedValue = value === "<p><br></p>" ? "" : value; // Normalize empty value
45+
setValue(normalizedValue);
4546
setIsTouch(true);
4647
if (props.onChange) {
47-
props.onChange(value, delta, source, editor);
48+
props.onChange(normalizedValue, delta, source, editor);
4849
}
4950
};
5051

raaghu-layouts/src/rds-comp-app-shell/rds-comp-app-shell.stories.tsx

Lines changed: 13 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -3,36 +3,29 @@ import type { Meta, StoryObj } from "@storybook/react";
33
import RdsCompAppShell, { AppShellDisplayType } from "./rds-comp-app-shell";
44
import RdsCompSideNavigation from "../../../raaghu-components/src/rds-comp-side-navigation";
55
import RdsCompTopNavigation from "../../../raaghu-components/src/rds-comp-top-navigation/rds-comp-top-navigation";
6-
import { Routes, Route, Outlet } from "react-router-dom";
6+
import { BrowserRouter } from "react-router-dom";
77
import "./rds-comp-app-shell.css";
8-
8+
99
const meta: Meta<typeof RdsCompAppShell> = {
1010
title: "Application Shells",
1111
component: RdsCompAppShell,
1212
parameters: {
1313
layout: "padded",
14-
docs: {
15-
description: {},
16-
}
1714
},
1815
tags: ["autodocs"],
16+
argTypes: {},
1917
decorators: [
2018
(Story) => (
21-
<Routes>
22-
<Route path="/" element={<Story />}>
23-
<Route index element={<div></div>} />
24-
<Route path="dashboard" element={<div>Dashboard Content</div>} />
25-
<Route path="users" element={<div>Users Content</div>} />
26-
<Route path="settings" element={<div>Settings Content</div>} />
27-
</Route>
28-
</Routes>
19+
<BrowserRouter>
20+
<Story />
21+
</BrowserRouter>
2922
),
3023
],
3124
};
32-
25+
3326
export default meta;
3427
type Story = StoryObj<typeof RdsCompAppShell>;
35-
28+
3629
export const Basic: Story = {
3730
args: {
3831
displayType: AppShellDisplayType.Default,
@@ -247,7 +240,7 @@ export const Basic: Story = {
247240
),
248241
},
249242
};
250-
243+
251244
// Add more variants
252245
export const HeaderOnly: Story = {
253246
args: {
@@ -344,8 +337,6 @@ export const HeaderOnly: Story = {
344337
componentsList={[]}
345338
languageLabel={""}
346339
themeLabel={""}
347-
style={"ABP"}
348-
showLogo={true}
349340
onForgotPassword={function (isForgotPasswordClicked?: boolean): void {
350341
console.log("Forgot password clicked:", isForgotPasswordClicked);
351342
}}
@@ -356,11 +347,13 @@ export const HeaderOnly: Story = {
356347
): void {
357348
console.log("Profile link clicked:", id, navigateTo, label);
358349
}}
350+
style={"ABP"}
351+
showLogo={true}
359352
/>
360353
),
361354
},
362355
};
363-
356+
364357
export const SidebarOnly: Story = {
365358
args: {
366359
displayType: AppShellDisplayType.SideNav,
@@ -389,4 +382,4 @@ export const SidebarOnly: Story = {
389382
/>
390383
),
391384
},
392-
};
385+
};
Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,46 @@
1-
import React, { ReactNode } from "react";
1+
import React, { ReactNode, useState } from "react";
22
import "./rds-comp-app-shell.css";
3-
import { Outlet } from "react-router-dom";
3+
import { BrowserRouter, Outlet } from "react-router-dom";
44
import RdsCompTopNavigation from "../../../raaghu-components/src/rds-comp-top-navigation";
55
import RdsSideNav from "../../../raaghu-elements/src/rds-side-nav";
66
import { NavLayout, NavType, Platform } from "../../../raaghu-elements/src/rds-side-nav/rds-side-nav";
77
export * from "../../../raaghu-elements/src/index";
88
export * from "../../../raaghu-components/src/index";
9-
109
export interface RdsCompAppShellProps {
1110
displayType: AppShellDisplayType;
1211
topbar?: ReactNode;
1312
sidebar?: ReactNode;
14-
children?: ReactNode;
1513
}
16-
14+
1715
export enum AppShellDisplayType {
1816
Basic = "Basic",
19-
Header = "Header",
17+
Header = "Header",
2018
Default = "Default",
2119
Relaxing = "Relaxing",
2220
TopNav = "Top Nav",
2321
SideNav = "Side Nav",
2422
DoubleNav = "Double Nav",
2523
OneThreeOne = "1-3-1"
2624
}
27-
25+
26+
2827
const RdsCompAppShell = (props: RdsCompAppShellProps) => {
28+
2929
return (
30-
<div className={props.displayType?.toString()}>
31-
<div className="sidebar-layout">
32-
{props.sidebar}
30+
<>
31+
32+
<div className={props.displayType?.toString()}>
33+
<div className="sidebar-layout">
34+
{props.sidebar}
35+
</div>
36+
37+
<div className="topnav-layout">
38+
{props.topbar}
39+
<Outlet />
40+
</div>
3341
</div>
34-
<div className="topnav-layout">
35-
{props.topbar}
36-
{props.children || <Outlet />}
37-
</div>
38-
</div>
42+
</>
3943
);
4044
};
41-
42-
export default RdsCompAppShell;
45+
46+
export default RdsCompAppShell;

0 commit comments

Comments
 (0)