ThemeProvider.tsx 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. import React from 'react';
  2. import dynamic from 'next/dynamic';
  3. import { GrowiThemes } from '~/interfaces/theme';
  4. import { Themes } from '~/stores/use-next-themes';
  5. const ThemeAntarctic = dynamic(() => import('../ThemeAntarctic'));
  6. const ThemeBlackboard = dynamic(() => import('../ThemeBlackboard'));
  7. const ThemeChristmas = dynamic(() => import('../ThemeChristmas'));
  8. const ThemeDefault = dynamic(() => import('../ThemeDefault'));
  9. const ThemeFireRed = dynamic(() => import('../ThemeFireRed'));
  10. const ThemeFuture = dynamic(() => import('../ThemeFuture'));
  11. const ThemeHalloween = dynamic(() => import('../ThemeHalloween'));
  12. const ThemeHufflepuff = dynamic(() => import('../ThemeHufflepuff'));
  13. const ThemeIsland = dynamic(() => import('../ThemeIsland'));
  14. const ThemeJadeGreen = dynamic(() => import('../ThemeJadeGreen'));
  15. const ThemeKibela = dynamic(() => import('../ThemeKibela'));
  16. const ThemeMonoBlue = dynamic(() => import('../ThemeMonoBlue'));
  17. const ThemeNature = dynamic(() => import('../ThemeNature'));
  18. const ThemeSpring = dynamic(() => import('../ThemeSpring'));
  19. const ThemeWood = dynamic(() => import('../ThemeWood'));
  20. type Props = {
  21. children: JSX.Element,
  22. theme?: GrowiThemes,
  23. colorScheme?: Themes,
  24. }
  25. export const ThemeProvider = ({ theme, children, colorScheme }: Props): JSX.Element => {
  26. switch (theme) {
  27. case GrowiThemes.ANTARCTIC:
  28. return <ThemeAntarctic colorScheme={colorScheme}>{children}</ThemeAntarctic>;
  29. case GrowiThemes.BLACKBOARD:
  30. return <ThemeBlackboard>{children}</ThemeBlackboard>;
  31. case GrowiThemes.CHRISTMAS:
  32. return <ThemeChristmas colorScheme={colorScheme}>{children}</ThemeChristmas>;
  33. case GrowiThemes.FIRE_RED:
  34. return <ThemeFireRed>{children}</ThemeFireRed>;
  35. case GrowiThemes.FUTURE:
  36. return <ThemeFuture>{children}</ThemeFuture>;
  37. case GrowiThemes.HALLOWEEN:
  38. return <ThemeHalloween colorScheme={colorScheme}>{children}</ThemeHalloween>;
  39. case GrowiThemes.HUFFLEPUFF:
  40. return <ThemeHufflepuff colorScheme={colorScheme}>{children}</ThemeHufflepuff>;
  41. case GrowiThemes.ISLAND:
  42. return <ThemeIsland colorScheme={colorScheme}>{children}</ThemeIsland>;
  43. case GrowiThemes.JADE_GREEN:
  44. return <ThemeJadeGreen>{children}</ThemeJadeGreen>;
  45. case GrowiThemes.KIBELA:
  46. return <ThemeKibela>{children}</ThemeKibela>;
  47. case GrowiThemes.MONO_BLUE:
  48. return <ThemeMonoBlue>{children}</ThemeMonoBlue>;
  49. case GrowiThemes.NATURE:
  50. return <ThemeNature>{children}</ThemeNature>;
  51. case GrowiThemes.SPRING:
  52. return <ThemeSpring>{children}</ThemeSpring>;
  53. case GrowiThemes.WOOD:
  54. return <ThemeWood>{children}</ThemeWood>;
  55. default:
  56. return <ThemeDefault>{children}</ThemeDefault>;
  57. }
  58. };