Skip to content

Commit b2ca8d6

Browse files
committed
update: added a survey modal
1 parent ef4bc4c commit b2ca8d6

File tree

5 files changed

+990
-404
lines changed

5 files changed

+990
-404
lines changed

src/App.jsx

Lines changed: 178 additions & 159 deletions
Original file line numberDiff line numberDiff line change
@@ -126,11 +126,12 @@ import ZenUIHeroDocsPage from "./Pages/ZenUIHeroDocsPage.jsx";
126126
import TimerPage from "./Pages/Components/Navigation/TimerPage.jsx";
127127
import ShortcutGeneratorPage from "./Pages/ShortcutGeneratorPage.jsx";
128128
import AIGeneratorPage from "./Pages/AIGeneratorPage.jsx";
129-
import { MenuProvider } from "./Context/MenuContext.jsx";
129+
import {MenuProvider} from "./Context/MenuContext.jsx";
130130
import GithubActivityGraphPage from "./Pages/Components/Data Display/GithubActivityGraphPage.jsx";
131131
import ComparisonCardPage from "./Pages/Components/Surfaces/ComparisonCardPage.jsx";
132132
import LazyImagePackagePlaygroundPage from "./Pages/LazyImagePackagePlaygroundPage.jsx";
133133
import usePageTracking from "./CustomHooks/usePageTracking.js";
134+
import QuickSurveyModal from "./Shared/QuickSurvey/QuickSurveyModal.jsx";
134135

135136

136137
const App = () => {
@@ -147,165 +148,183 @@ const App = () => {
147148
document.title = Title;
148149
})
149150

151+
useEffect(() => {
152+
const widget = document.querySelector('#replicate-widget-container');
153+
154+
if (widget && widget.shadowRoot) {
155+
const shadowRoot = widget.shadowRoot;
156+
const style = document.createElement('style');
157+
style.textContent = `
158+
#feedbackWidget {
159+
z-index: 1000 !important;
160+
}
161+
`;
162+
shadowRoot.appendChild(style);
163+
}
164+
}, []);
165+
150166
return (
151-
<Suspense>
152-
<MenuProvider>
153-
{/* all routes */}
154-
<Routes>
155-
<Route path="/" element={<HomePage/>}/>
156-
<Route path="/about-us" element={<AboutUsPage/>}/>
157-
<Route path="/privacy-policy" element={<PrivacyPolicyPage/>}/>
158-
159-
{/* documentation */}
160-
<Route path="/docs/overview" element={<OverviewPage/>}/>
161-
<Route path="/docs/resources" element={<ResourcesPage/>}/>
162-
<Route path="/custom-hooks" element={<ReactCustomHooksPage/>}/>
163-
<Route path="/docs/installation" element={<InstallationPage/>}/>
164-
<Route path="/templates" element={<TempletePage/>}/>
165-
166-
{/* components */}
167-
168-
<Route
169-
path="/components/all-components"
170-
element={<AllComponentsPage/>}
171-
/>
172-
173-
{/* inputs */}
174-
<Route path="/components/input-text" element={<InputTextPage/>}/>
175-
<Route
176-
path="/components/input-textarea"
177-
element={<InputTextareaPage/>}
178-
/>
179-
<Route path="/components/input-switch" element={<InputSwitchPage/>}/>
180-
<Route path="/components/otp-input" element={<OtpInputPage/>}/>
181-
<Route path="/components/input-select" element={<InputSelectPage/>}/>
182-
<Route path="/components/input-radio" element={<InputRadioPage/>}/>
183-
<Route path="/components/input-file" element={<InputFilePage/>}/>
184-
<Route path="/components/input-number" element={<NumberInputPage/>}/>
185-
<Route path="/components/strong-password" element={<StrongPasswordPage/>}/>
186-
<Route path="/components/input-checkbox" element={<CheckboxInputPage/>}/>
187-
<Route path="/components/input-range" element={<InputSliderPage/>}/>
188-
189-
{/* buttons */}
190-
<Route path="/components/normal-button" element={<NormalPage/>}/>
191-
<Route path="/components/login-buttons" element={<AuthButtonPage/>}/>
192-
<Route path="/components/dropdown-button" element={<DropdownButtonPage/>}/>
193-
<Route
194-
path="/components/animated-button"
195-
element={<AnimatedButtonPage/>}
196-
/>
197-
198-
{/* navigation */}
199-
<Route path="/components/pagination" element={<PaginationPage/>}/>
200-
<Route path="/components/tabs" element={<TabsPage/>}/>
201-
<Route path="/components/modal" element={<ModalPage/>}/>
202-
<Route path="/components/progress-bar" element={<ProgressBarPage/>}/>
203-
<Route path="/components/chip" element={<ChipPage/>}/>
204-
<Route path="/components/marquee" element={<MarqueePage/>}/>
205-
<Route path="/components/timer" element={<TimerPage/>}/>
206-
<Route path="/components/breadcrumb" element={<BreadcrumbPage/>}/>
207-
<Route path="/components/rating" element={<RatingPage/>}/>
208-
<Route path="/components/stepper" element={<StepsPage/>}/>
209-
210-
{/* feedback */}
211-
<Route path="/components/context-menu" element={<ContextMenuPage/>}/>
212-
<Route path="/components/skeleton" element={<SkeletonPage/>}/>
213-
<Route
214-
path="/components/alert-message"
215-
element={<AlertMessagePage/>}
216-
/>
217-
<Route path="/components/dialog-message" element={<DialogPage/>}/>
218-
<Route path="/components/tree-dropdown" element={<TreeDropdownPage/>}/>
219-
<Route path="/components/loader" element={<LoaderPage/>}/>
220-
<Route path="/components/testimonials" element={<TestimonialPage/>}/>
221-
<Route path="/components/notification" element={<NotificationPage/>}/>
222-
223-
{/* surface */}
224-
<Route path="/components/cards" element={<CardPage/>}/>
225-
<Route path="/components/drag-and-drop" element={<DragAndDropPage/>}/>
226-
<Route path="/components/comparison-card" element={<ComparisonCardPage/>}/>
227-
<Route path="/components/image-cropper" element={<ImageCropperPage/>}/>
228-
<Route path="/components/animated-cards" element={<AnimatedCardsPage/>}/>
229-
<Route
230-
path="/components/image-gallery"
231-
element={<ImageGalleryPage/>}
232-
/>
233-
<Route path="/components/carousel" element={<CarouselPage />}/>
234-
<Route path="/components/according" element={<AccordingPage/>}/>
235-
<Route path="/components/appbar" element={<AppbarPage/>}/>
236-
<Route path="/components/resizable-layout" element={<ResizableLayoutPage/>}/>
237-
238-
{/* data display */}
239-
<Route path="/components/badge" element={<BadgePage/>}/>
240-
<Route path="/components/table" element={<TablePage/>}/>
241-
<Route path="/components/github-activity-graph" element={<GithubActivityGraphPage/>}/>
242-
<Route path="/components/pie-chart" element={<PieChartPage/>}/>
243-
<Route path="/components/tooltip" element={<TooltipPage/>}/>
244-
<Route path="/components/redo-undo" element={<RedoUndoPage/>}/>
245-
<Route path="/components/timeline" element={<TimelinePage/>}/>
246-
247-
{/* e-commerce */}
248-
<Route path="/components/product-card" element={<ProductCardPage/>}/>
249-
<Route path="/components/ads-card" element={<AdsCardPage/>}/>
250-
251-
{/* randoms */}
252-
<Route path="/components/code" element={<CodeSnippetPage/>}/>
253-
<Route path="/components/snippet" element={<SnippetPage/>}/>
254-
255-
256-
{/* all blocks route */}
257-
<Route path="/blocks/all-blocks" element={<AllBlocksPage/>}/>
258-
<Route path="/blocks/responsive-navbar" element={<ResponsiveNavbarPage/>}/>
259-
<Route path="/blocks/hero-section" element={<HeroSectionPage/>}/>
260-
<Route path="/blocks/contact-form" element={<ContactFormPage/>}/>
261-
<Route path="/blocks/responsive-search-bar" element={<ResponsiveSearchbarPage/>}/>
262-
<Route path="/blocks/responsive-footer" element={<ResponsiveFooterPage/>}/>
263-
<Route path="/blocks/404-page" element={<WrongUrlErrorPage/>}/>
264-
<Route path="/blocks/pricing-section" element={<PricingSectionPage/>}/>
265-
<Route path="/blocks/newsletter-form" element={<NewsletterSectionPage/>}/>
266-
<Route path="/blocks/multi-step-form" element={<MultipageFormPage/>}/>
267-
<Route path="/blocks/responsive-sidebar" element={<ResponsiveSidebarPage/>}/>
268-
<Route path="/blocks/empty-page" element={<WrongRoutePage/>}/>
269-
270-
{/* e-commerce blocks */}
271-
<Route path="/blocks/offer-grid" element={<OfferGridPage/>}/>
272-
<Route path="/blocks/product-details-page" element={<ProductDetailsPage/>}/>
273-
<Route path="/blocks/product-filter-page" element={<ProductFilterPage/>}/>
274-
<Route path="/blocks/checkout-page" element={<CheckoutPage/>}/>
275-
276-
277-
{/* icons */}
278-
<Route path="/icons" element={<IconsPage/>}/>
279-
280-
{/* opacity palette */}
281-
<Route path='/color-palette' element={<OpacityPalettePage/>}/>
282-
283-
{/* layout playground */}
284-
<Route path='/layout-playground' element={<LayoutPlaygroundPage/>}/>
285-
286-
{/* layout playground */}
287-
<Route path='/shortcut-generator' element={<ShortcutGeneratorPage/>}/>
288-
289-
{/* AI Generator */}
290-
<Route path="/config-generator" element={<AIGeneratorPage/>}/>
291-
292-
{/* become ZenUI Hero */}
293-
<Route path='/zenui-hero-docs' element={<ZenUIHeroDocsPage/>}/>
294-
295-
{/* zenui lazy image package */}
296-
<Route path='/zenui-image-react-playground' element={<LazyImagePackagePlaygroundPage/>}/>
297-
298-
{/* Tag master */}
299-
<Route path='/semantic-tag-master' element={<SemanticTagMasterPage/>}/>
300-
301-
{/* empty route */}
302-
<Route path="*" element={<EmptyPage/>}/>
303-
304-
</Routes>
305-
306-
<CookieModal isModalOpen={isCookie} setisModalOpen={setIsCookie}/>
307-
</MenuProvider>
308-
</Suspense>
167+
<>
168+
<QuickSurveyModal/>
169+
<Suspense>
170+
<MenuProvider>
171+
{/* all routes */}
172+
<Routes>
173+
<Route path="/" element={<HomePage/>}/>
174+
<Route path="/about-us" element={<AboutUsPage/>}/>
175+
<Route path="/privacy-policy" element={<PrivacyPolicyPage/>}/>
176+
177+
{/* documentation */}
178+
<Route path="/docs/overview" element={<OverviewPage/>}/>
179+
<Route path="/docs/resources" element={<ResourcesPage/>}/>
180+
<Route path="/custom-hooks" element={<ReactCustomHooksPage/>}/>
181+
<Route path="/docs/installation" element={<InstallationPage/>}/>
182+
<Route path="/templates" element={<TempletePage/>}/>
183+
184+
{/* components */}
185+
186+
<Route
187+
path="/components/all-components"
188+
element={<AllComponentsPage/>}
189+
/>
190+
191+
{/* inputs */}
192+
<Route path="/components/input-text" element={<InputTextPage/>}/>
193+
<Route
194+
path="/components/input-textarea"
195+
element={<InputTextareaPage/>}
196+
/>
197+
<Route path="/components/input-switch" element={<InputSwitchPage/>}/>
198+
<Route path="/components/otp-input" element={<OtpInputPage/>}/>
199+
<Route path="/components/input-select" element={<InputSelectPage/>}/>
200+
<Route path="/components/input-radio" element={<InputRadioPage/>}/>
201+
<Route path="/components/input-file" element={<InputFilePage/>}/>
202+
<Route path="/components/input-number" element={<NumberInputPage/>}/>
203+
<Route path="/components/strong-password" element={<StrongPasswordPage/>}/>
204+
<Route path="/components/input-checkbox" element={<CheckboxInputPage/>}/>
205+
<Route path="/components/input-range" element={<InputSliderPage/>}/>
206+
207+
{/* buttons */}
208+
<Route path="/components/normal-button" element={<NormalPage/>}/>
209+
<Route path="/components/login-buttons" element={<AuthButtonPage/>}/>
210+
<Route path="/components/dropdown-button" element={<DropdownButtonPage/>}/>
211+
<Route
212+
path="/components/animated-button"
213+
element={<AnimatedButtonPage/>}
214+
/>
215+
216+
{/* navigation */}
217+
<Route path="/components/pagination" element={<PaginationPage/>}/>
218+
<Route path="/components/tabs" element={<TabsPage/>}/>
219+
<Route path="/components/modal" element={<ModalPage/>}/>
220+
<Route path="/components/progress-bar" element={<ProgressBarPage/>}/>
221+
<Route path="/components/chip" element={<ChipPage/>}/>
222+
<Route path="/components/marquee" element={<MarqueePage/>}/>
223+
<Route path="/components/timer" element={<TimerPage/>}/>
224+
<Route path="/components/breadcrumb" element={<BreadcrumbPage/>}/>
225+
<Route path="/components/rating" element={<RatingPage/>}/>
226+
<Route path="/components/stepper" element={<StepsPage/>}/>
227+
228+
{/* feedback */}
229+
<Route path="/components/context-menu" element={<ContextMenuPage/>}/>
230+
<Route path="/components/skeleton" element={<SkeletonPage/>}/>
231+
<Route
232+
path="/components/alert-message"
233+
element={<AlertMessagePage/>}
234+
/>
235+
<Route path="/components/dialog-message" element={<DialogPage/>}/>
236+
<Route path="/components/tree-dropdown" element={<TreeDropdownPage/>}/>
237+
<Route path="/components/loader" element={<LoaderPage/>}/>
238+
<Route path="/components/testimonials" element={<TestimonialPage/>}/>
239+
<Route path="/components/notification" element={<NotificationPage/>}/>
240+
241+
{/* surface */}
242+
<Route path="/components/cards" element={<CardPage/>}/>
243+
<Route path="/components/drag-and-drop" element={<DragAndDropPage/>}/>
244+
<Route path="/components/comparison-card" element={<ComparisonCardPage/>}/>
245+
<Route path="/components/image-cropper" element={<ImageCropperPage/>}/>
246+
<Route path="/components/animated-cards" element={<AnimatedCardsPage/>}/>
247+
<Route
248+
path="/components/image-gallery"
249+
element={<ImageGalleryPage/>}
250+
/>
251+
<Route path="/components/carousel" element={<CarouselPage/>}/>
252+
<Route path="/components/according" element={<AccordingPage/>}/>
253+
<Route path="/components/appbar" element={<AppbarPage/>}/>
254+
<Route path="/components/resizable-layout" element={<ResizableLayoutPage/>}/>
255+
256+
{/* data display */}
257+
<Route path="/components/badge" element={<BadgePage/>}/>
258+
<Route path="/components/table" element={<TablePage/>}/>
259+
<Route path="/components/github-activity-graph" element={<GithubActivityGraphPage/>}/>
260+
<Route path="/components/pie-chart" element={<PieChartPage/>}/>
261+
<Route path="/components/tooltip" element={<TooltipPage/>}/>
262+
<Route path="/components/redo-undo" element={<RedoUndoPage/>}/>
263+
<Route path="/components/timeline" element={<TimelinePage/>}/>
264+
265+
{/* e-commerce */}
266+
<Route path="/components/product-card" element={<ProductCardPage/>}/>
267+
<Route path="/components/ads-card" element={<AdsCardPage/>}/>
268+
269+
{/* randoms */}
270+
<Route path="/components/code" element={<CodeSnippetPage/>}/>
271+
<Route path="/components/snippet" element={<SnippetPage/>}/>
272+
273+
274+
{/* all blocks route */}
275+
<Route path="/blocks/all-blocks" element={<AllBlocksPage/>}/>
276+
<Route path="/blocks/responsive-navbar" element={<ResponsiveNavbarPage/>}/>
277+
<Route path="/blocks/hero-section" element={<HeroSectionPage/>}/>
278+
<Route path="/blocks/contact-form" element={<ContactFormPage/>}/>
279+
<Route path="/blocks/responsive-search-bar" element={<ResponsiveSearchbarPage/>}/>
280+
<Route path="/blocks/responsive-footer" element={<ResponsiveFooterPage/>}/>
281+
<Route path="/blocks/404-page" element={<WrongUrlErrorPage/>}/>
282+
<Route path="/blocks/pricing-section" element={<PricingSectionPage/>}/>
283+
<Route path="/blocks/newsletter-form" element={<NewsletterSectionPage/>}/>
284+
<Route path="/blocks/multi-step-form" element={<MultipageFormPage/>}/>
285+
<Route path="/blocks/responsive-sidebar" element={<ResponsiveSidebarPage/>}/>
286+
<Route path="/blocks/empty-page" element={<WrongRoutePage/>}/>
287+
288+
{/* e-commerce blocks */}
289+
<Route path="/blocks/offer-grid" element={<OfferGridPage/>}/>
290+
<Route path="/blocks/product-details-page" element={<ProductDetailsPage/>}/>
291+
<Route path="/blocks/product-filter-page" element={<ProductFilterPage/>}/>
292+
<Route path="/blocks/checkout-page" element={<CheckoutPage/>}/>
293+
294+
295+
{/* icons */}
296+
<Route path="/icons" element={<IconsPage/>}/>
297+
298+
{/* opacity palette */}
299+
<Route path='/color-palette' element={<OpacityPalettePage/>}/>
300+
301+
{/* layout playground */}
302+
<Route path='/layout-playground' element={<LayoutPlaygroundPage/>}/>
303+
304+
{/* layout playground */}
305+
<Route path='/shortcut-generator' element={<ShortcutGeneratorPage/>}/>
306+
307+
{/* AI Generator */}
308+
<Route path="/config-generator" element={<AIGeneratorPage/>}/>
309+
310+
{/* become ZenUI Hero */}
311+
<Route path='/zenui-hero-docs' element={<ZenUIHeroDocsPage/>}/>
312+
313+
{/* zenui lazy image package */}
314+
<Route path='/zenui-image-react-playground' element={<LazyImagePackagePlaygroundPage/>}/>
315+
316+
{/* Tag master */}
317+
<Route path='/semantic-tag-master' element={<SemanticTagMasterPage/>}/>
318+
319+
{/* empty route */}
320+
<Route path="*" element={<EmptyPage/>}/>
321+
322+
</Routes>
323+
324+
<CookieModal isModalOpen={isCookie} setisModalOpen={setIsCookie}/>
325+
</MenuProvider>
326+
</Suspense>
327+
</>
309328
);
310329
};
311330

0 commit comments

Comments
 (0)