diff --git a/components/atoms/Fab/fab.tsx b/components/atoms/Fab/fab.tsx new file mode 100644 index 0000000000..1d88806198 --- /dev/null +++ b/components/atoms/Fab/fab.tsx @@ -0,0 +1,30 @@ +import clsx from "clsx"; +import React from "react"; + +interface FabProps extends React.HTMLAttributes { + position?: "top-left" | "top-right" | "bottom-left" | "bottom-right"; + onClick?: () => void; +} +const Fab = ({ position, children, className }: FabProps) => { + const getFabPositionStyles = () => { + switch (position) { + case "top-left": + return "top-4 left-4"; + case "top-right": + return "top-4 right-4"; + case "bottom-left": + return "bottom-4 left-4"; + case "bottom-right": + return "bottom-4 right-4"; + default: + return "bottom-8 right-8"; + } + }; + return ( + + ); +}; + +export default Fab; diff --git a/components/atoms/TextInput/text-input.tsx b/components/atoms/TextInput/text-input.tsx index 9f0392b452..2e4f41a120 100644 --- a/components/atoms/TextInput/text-input.tsx +++ b/components/atoms/TextInput/text-input.tsx @@ -7,7 +7,6 @@ interface TextInputProps extends React.InputHTMLAttributes { state?: "default" | "valid" | "invalid"; borderless?: boolean; descriptionText?: string; - classNames?: string; errorMsg?: string; fieldRef?: React.RefObject; handleChange?: (value: string) => void; @@ -21,7 +20,7 @@ const TextInput = ({ id, value, descriptionText, - classNames, + className, fieldRef, disabled = false, borderless = false, @@ -52,7 +51,7 @@ const TextInput = ({ borderless && "!border-none", state === "invalid" ? "focus-within:border-light-red-10" : "focus-within:border-light-orange-9 ", disabled && "bg-light-slate-3 text-light-slate-6", - classNames + className )} > {state === "valid" ? ( - + ) : !!value ? ( { - const { Portal, Root, Content, Trigger } = TooltipPrimitive; + const { Portal, Root, Content, Trigger, Arrow } = TooltipPrimitive; return ( @@ -19,13 +20,10 @@ const Tooltip = ({ children, content, className, direction }: TooltipProps): JSX -
+
{content}
+ diff --git a/components/atoms/TypeWriterTextArea/type-writer-text-area.tsx b/components/atoms/TypeWriterTextArea/type-writer-text-area.tsx new file mode 100644 index 0000000000..74faf575fd --- /dev/null +++ b/components/atoms/TypeWriterTextArea/type-writer-text-area.tsx @@ -0,0 +1,65 @@ +import React, { ChangeEvent, useEffect, useRef } from "react"; +import clsx from "clsx"; + +interface TypeWriterTextAreaProps extends React.TextareaHTMLAttributes { + onChangeText?: (value: string) => void; + typewrite?: boolean; + textContent?: string; + defaultRow?: number; +} + +const TypeWriterTextArea = React.forwardRef( + ({ className, onChangeText, typewrite, textContent, defaultRow, ...props }) => { + const textareaRef = useRef(null); + const autoGrowTextarea = () => { + const textarea = textareaRef.current; + if (textarea) { + textarea.style.height = "auto"; + textarea.style.height = `${textarea.scrollHeight}px`; + } + }; + + const typeWrite = (text: string) => { + const textarea = textareaRef.current; + if (textarea) { + textarea.focus(); + textarea.value = ""; + textarea.selectionStart = textarea.selectionEnd = textarea.value.length; + const interval = setInterval(() => { + if (textarea.value.length === text.length) { + clearInterval(interval); + } else { + textarea.value = text.slice(0, textarea.value.length + 1); + } + }, 10); + } + }; + + useEffect(() => { + if (typewrite && textContent) { + typeWrite(textContent); + } + }, [typewrite, textContent]); + + const handleInputChange = (event: ChangeEvent) => { + onChangeText?.(event.target.value); + autoGrowTextarea(); + }; + + return ( +
= NextPage & { - PageLayout?: React.ComponentType; - SEO?: SEOobject; - updateSEO?: (SEO: SEOobject) => void; - isPrivateRoute?: boolean; + PageLayout?: React.ComponentType; + SEO?: SEOobject; + updateSEO?: (SEO: SEOobject) => void; + isPrivateRoute?: boolean; }; diff --git a/jest.config.js b/jest.config.js index 797ac2ed97..27bbc0f0d8 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,12 +1,12 @@ const nextJest = require("next/jest"); const createJestConfig = nextJest({ - dir: "./" + dir: "./", }); const customJestConfig = { moduleDirectories: ["node_modules", "/"], - modulePathIgnorePatterns: ["e2e-tests"] + modulePathIgnorePatterns: ["e2e-tests"], /* testEnvironment: "jest-environment-jsdom" */ }; diff --git a/layouts/SEO/SEO.tsx b/layouts/SEO/SEO.tsx index 19c9b6f635..ed0febe919 100644 --- a/layouts/SEO/SEO.tsx +++ b/layouts/SEO/SEO.tsx @@ -1,21 +1,41 @@ import Head from "next/head"; -export default function SEO({description, image, title, twitterCard, noindex}: SEOobject) { - +export default function SEO({ description, image, title, twitterCard, noindex }: SEOobject) { return ( {title || "OpenSauced Insights"} - + - + {image && } - + {image && } diff --git a/lib/utils/generate-pr-highlight-summary.ts b/lib/utils/generate-pr-highlight-summary.ts new file mode 100644 index 0000000000..7697635e78 --- /dev/null +++ b/lib/utils/generate-pr-highlight-summary.ts @@ -0,0 +1,36 @@ +import { supabase } from "./supabase"; + +const baseUrl = process.env.NEXT_PUBLIC_API_URL; +export const generatePrHighlightSummaryByCommitMsg = async (commitMessages: string[]) => { + const sessionResponse = await supabase.auth.getSession(); + const sessionToken = sessionResponse?.data.session?.access_token; + const payload = { + descriptionLength: 400, + commitMessages, + language: "english", + diff: "commitMessage", + tone: "formal", + temperature: 7, + }; + + try { + const res = await fetch(`${baseUrl}/prs/description/generate`, { + method: "POST", + headers: { + "Content-type": "application/json", + Authorization: `Bearer ${sessionToken}`, + }, + body: JSON.stringify(payload), + }); + + if (res.ok) { + const data = await res.json(); + return data.description as string; + } else { + return null; + } + } catch (err) { + console.log(err); + return null; + } +}; diff --git a/lib/utils/github.ts b/lib/utils/github.ts index 61b80929db..689d01e06a 100644 --- a/lib/utils/github.ts +++ b/lib/utils/github.ts @@ -1,8 +1,16 @@ +import { supabase } from "./supabase"; + /** * This method replaces the `getAvatarLink` method * @todo Use `getAvatarById` instead of `getAvatarByUsername` whenever possible * @see {@link https://github.com/open-sauced/insights/issues/746} */ +export interface Commit { + commit: { + message: string; + }; +} + const getAvatarByUsername = (username: string | null, size = 460) => `https://www.github.com/${username ?? "github"}.png?size=${size}`; @@ -55,4 +63,40 @@ const generateGhOgImage = (githubUrl: string): { isValid: boolean; url: string } } }; -export { getAvatarById, getAvatarByUsername, getProfileLink, getRepoIssuesLink, generateApiPrUrl, generateGhOgImage }; +const getPullRequestCommitMessageFromUrl = async (url: string): Promise => { + const sessionResponse = await supabase.auth.getSession(); + const githubToken = sessionResponse?.data.session?.provider_token; + const [, , , owner, repoName, , pullRequestNumber] = url.split("/"); + + const apiUrl = `https://api.github.com/repos/${owner}/${repoName}/pulls/${pullRequestNumber}/commits`; + + const response = await fetch(apiUrl, { + headers: { + Authorization: `token ${githubToken}`, + }, + }); + const data = await response.json(); + + console.log(sessionResponse); + + if (Array.isArray(data?.commits)) { + return (data.commits as Commit[]).map((commit: Commit): string => commit.commit.message); + } + + return (data as Commit[]).map((commit: Commit): string => commit.commit.message); +}; + +const isValidPullRequestUrl = (url: string): boolean => { + return url.match(/((https?:\/\/)?(www\.)?github\.com\/[^\/]+\/[^\/]+\/pull\/[0-9]+)/) ? true : false; +}; + +export { + getAvatarById, + getAvatarByUsername, + getProfileLink, + getRepoIssuesLink, + generateApiPrUrl, + generateGhOgImage, + isValidPullRequestUrl, + getPullRequestCommitMessageFromUrl, +}; diff --git a/next.config.js b/next.config.js index 4fe48c2499..eb06b2d08b 100644 --- a/next.config.js +++ b/next.config.js @@ -7,12 +7,11 @@ module.exports = { "images.unsplash.com", "www.github.com", "github.com", - "res.cloudinary.com" - ] - } + "res.cloudinary.com", + ], + }, }; - // Injected content via Sentry wizard below const { withSentryConfig } = require("@sentry/nextjs"); diff --git a/pages/_app.tsx b/pages/_app.tsx index 3350e34d22..bf423f9304 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -20,6 +20,7 @@ import { supabase } from "lib/utils/supabase"; import SEO from "layouts/SEO/SEO"; import { Toaster } from "components/molecules/Toaster/toaster"; +import { useMediaQuery } from "lib/hooks/useMediaQuery"; import useSession from "lib/hooks/useSession"; import PrivateWrapper from "layouts/private-wrapper"; @@ -49,6 +50,7 @@ function MyApp({ Component, pageProps }: ComponentWithPageLayout) { useSession(true); const router = useRouter(); const [seo, updateSEO] = useState(Component.SEO || {}); + const isMobile = useMediaQuery("(max-width: 640px)"); Component.updateSEO = updateSEO; const [supabaseClient] = useState(() => supabase); @@ -56,6 +58,8 @@ function MyApp({ Component, pageProps }: ComponentWithPageLayout) { if (typeof window !== "undefined") hostname = window.location.hostname; + console.log(router.asPath); + useEffect(() => { let chatButton = document.getElementById("sitegpt-chat-icon"); @@ -64,6 +68,9 @@ function MyApp({ Component, pageProps }: ComponentWithPageLayout) { if (chatButton) { if (hostname !== "insights.opensauced.pizza") { chatButton.style.display = "none"; + } + if (router.asPath === "/feed" && isMobile) { + chatButton.style.display = "none"; } else { chatButton.style.display = "block"; } diff --git a/playwright.config.ts b/playwright.config.ts index 23b7fad5d4..9e7c4025b9 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -19,7 +19,7 @@ const config: PlaywrightTestConfig = { * Maximum time expect() should wait for the condition to be met. * For example in `await expect(locator).toHaveText();` */ - timeout: 5000 + timeout: 5000, }, /* Run tests in files in parallel */ fullyParallel: true, @@ -39,7 +39,7 @@ const config: PlaywrightTestConfig = { baseURL: "http://localhost:3000", /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ - trace: "on-first-retry" + trace: "on-first-retry", }, /* Configure projects for major browsers */ @@ -47,23 +47,23 @@ const config: PlaywrightTestConfig = { { name: "chromium", use: { - ...devices["Desktop Chrome"] - } + ...devices["Desktop Chrome"], + }, }, { name: "firefox", use: { - ...devices["Desktop Firefox"] - } + ...devices["Desktop Firefox"], + }, }, { name: "webkit", use: { - ...devices["Desktop Safari"] - } - } + ...devices["Desktop Safari"], + }, + }, /* Test against mobile viewports. */ // { @@ -100,8 +100,8 @@ const config: PlaywrightTestConfig = { /* Run your local dev server before starting the tests */ webServer: { command: "npm run dev", - port: 3000 - } + port: 3000, + }, }; export default config; diff --git a/postcss.config.js b/postcss.config.js index 5cbc2c7d87..12a703d900 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -1,6 +1,6 @@ module.exports = { plugins: { tailwindcss: {}, - autoprefixer: {} - } + autoprefixer: {}, + }, }; diff --git a/stories/Template/loader.stories.tsx b/stories/Template/loader.stories.tsx index e16834feab..d2416d1397 100644 --- a/stories/Template/loader.stories.tsx +++ b/stories/Template/loader.stories.tsx @@ -4,20 +4,18 @@ import Loader from "components/templates/Loader/loader"; const StoryConfig = { title: "Design System/Template/Loader", argTypes: { - theme: ["light","dark"] - } + theme: ["light", "dark"], + }, }; export default StoryConfig; - - const LoaderTemplate: ComponentStory = (args) => ; export const DarkLoader = LoaderTemplate.bind({}); DarkLoader.args = { - theme: "dark" + theme: "dark", }; export const LightLoader = LoaderTemplate.bind({}); LightLoader.args = { - theme: "light" + theme: "light", }; diff --git a/stories/atoms/avatar-hover-card.stories.tsx b/stories/atoms/avatar-hover-card.stories.tsx index 6cc271820b..3153ef2782 100644 --- a/stories/atoms/avatar-hover-card.stories.tsx +++ b/stories/atoms/avatar-hover-card.stories.tsx @@ -3,7 +3,7 @@ import { ComponentStory } from "@storybook/react"; import AvatarHoverCard from "components/atoms/Avatar/avatar-hover-card"; const storyConfig = { - title: "Design System/Atoms/AvatarHoverCard" + title: "Design System/Atoms/AvatarHoverCard", }; export default storyConfig; @@ -20,5 +20,5 @@ export const AvatarHoverCardStory = AvatarTemplate.bind({}); AvatarHoverCardStory.args = { contributor: "bdougie", - repositories: [] + repositories: [], }; diff --git a/stories/atoms/avatar.stories.tsx b/stories/atoms/avatar.stories.tsx index 243d3f5a3b..4d5d309973 100644 --- a/stories/atoms/avatar.stories.tsx +++ b/stories/atoms/avatar.stories.tsx @@ -7,13 +7,13 @@ const storyConfig = { argTypes: { size: { options: ["sm", "base", "lg"], - control: { type: "select" } + control: { type: "select" }, }, hasBorder: { options: [true, false], - control: {type: "radio"} - } - } + control: { type: "radio" }, + }, + }, }; export default storyConfig; @@ -21,13 +21,27 @@ export default storyConfig; const AvatarTemplate: ComponentStory = (args) => ; export const Default = AvatarTemplate.bind({}); -Default.args = { size: "base", hasBorder: false, avatarURL: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", initials: "BD", alt:"Hello" }; +Default.args = { + size: "base", + hasBorder: false, + avatarURL: + "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", + initials: "BD", + alt: "Hello", +}; export const HasBorder = AvatarTemplate.bind({}); -HasBorder.args = { size: "base", hasBorder: true, avatarURL: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", initials: "BD", alt:"Hello" }; +HasBorder.args = { + size: "base", + hasBorder: true, + avatarURL: + "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", + initials: "BD", + alt: "Hello", +}; export const NoURL = AvatarTemplate.bind({}); -NoURL.args = { size: "base", hasBorder: true, initials: "BD", alt:"Hello" }; +NoURL.args = { size: "base", hasBorder: true, initials: "BD", alt: "Hello" }; export const CustomAvatar = AvatarTemplate.bind({}); CustomAvatar.args = { @@ -36,5 +50,5 @@ CustomAvatar.args = { avatarURL: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", initials: "BD", - alt: "Hello" -}; \ No newline at end of file + alt: "Hello", +}; diff --git a/stories/atoms/badge.stories.tsx b/stories/atoms/badge.stories.tsx index c86856f4e8..e158d7e7ad 100644 --- a/stories/atoms/badge.stories.tsx +++ b/stories/atoms/badge.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import Badge from "components/atoms/Badge/badge"; const StoryConfig = { - title: "Design System/Atoms/Badge" + title: "Design System/Atoms/Badge", }; export default StoryConfig; @@ -11,5 +11,5 @@ const BadgeTemplate: ComponentStory = (args) => Test + children: <>Test, }; Heading.args = { heading: "Test", - children: <>Test -}; \ No newline at end of file + children: <>Test, +}; diff --git a/stories/atoms/cart-illustration.stories.tsx b/stories/atoms/cart-illustration.stories.tsx index 9bb7578008..8197bd4ec8 100644 --- a/stories/atoms/cart-illustration.stories.tsx +++ b/stories/atoms/cart-illustration.stories.tsx @@ -1,7 +1,7 @@ import CartIllustration from "components/atoms/CartIllustration/cart-illustration"; const storyConfig = { - title: "Design System/Atoms/CartIllustration" + title: "Design System/Atoms/CartIllustration", }; export default storyConfig; diff --git a/stories/atoms/checkbox.stories.tsx b/stories/atoms/checkbox.stories.tsx index b338ea03e5..a5c71ca103 100644 --- a/stories/atoms/checkbox.stories.tsx +++ b/stories/atoms/checkbox.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import Checkbox from "components/atoms/Checkbox/checkbox"; const storyConfig = { - title: "Design System/Atoms/Checkbox" + title: "Design System/Atoms/Checkbox", }; export default storyConfig; diff --git a/stories/atoms/context-filter-button.stories.tsx b/stories/atoms/context-filter-button.stories.tsx index d91ef35e5d..b68f184da7 100644 --- a/stories/atoms/context-filter-button.stories.tsx +++ b/stories/atoms/context-filter-button.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ContextFilterButton from "components/atoms/ContextFilterButton/context-filter-button"; const storyConfig = { - title: "Design System/Atoms/ContextFilterButton" + title: "Design System/Atoms/ContextFilterButton", }; export default storyConfig; @@ -12,5 +12,5 @@ const ContextFilterButtonTemplate: ComponentStory = export const Default = ContextFilterButtonTemplate.bind({}); Default.args = { - children:
Text
+ children:
Text
, }; diff --git a/stories/atoms/context-filter-option.stories.tsx b/stories/atoms/context-filter-option.stories.tsx index e3eacb08a2..44277c39e8 100644 --- a/stories/atoms/context-filter-option.stories.tsx +++ b/stories/atoms/context-filter-option.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ContextFilterOption from "components/atoms/ContextFilterOption/context-filter-option"; const storyConfig = { - title: "Design System/Atoms/ContextFilterOption" + title: "Design System/Atoms/ContextFilterOption", }; export default storyConfig; @@ -12,9 +12,9 @@ const ContextFilterOptionTemplate: ComponentStory = export const Default = ContextFilterOptionTemplate.bind({}); export const Selected = ContextFilterOptionTemplate.bind({}); Default.args = { - children:
Have >5 contributors
+ children:
Have >5 contributors
, }; Selected.args = { children:
Have >5 contributors
, - isSelected: true + isSelected: true, }; diff --git a/stories/atoms/context-thumbnail.stories.tsx b/stories/atoms/context-thumbnail.stories.tsx index aaf17a714a..59c5959584 100644 --- a/stories/atoms/context-thumbnail.stories.tsx +++ b/stories/atoms/context-thumbnail.stories.tsx @@ -4,7 +4,7 @@ import Thumbnail from "../../img/hacktoberfest-icon.png"; const storyConfig = { title: "Design System/Atoms/Context Thumbnail", - component: "ContextThumbnail" + component: "ContextThumbnail", }; export default storyConfig; @@ -17,5 +17,5 @@ export const Default = ContextThumbnailTemplate.bind({}); Default.args = { ContextThumbnailURL: Thumbnail.src, alt: "Test", - size: 96 + size: 96, }; diff --git a/stories/atoms/echart-wrapper.stories.tsx b/stories/atoms/echart-wrapper.stories.tsx index e757852ba6..3e3431dca3 100644 --- a/stories/atoms/echart-wrapper.stories.tsx +++ b/stories/atoms/echart-wrapper.stories.tsx @@ -3,7 +3,7 @@ import EChartWrapper from "../../components/atoms/EChartWrapper/echart-wrapper"; const storyConfig = { title: "Design System/Atoms/eChart Wrapper", - component: "EChartWrapper" + component: "EChartWrapper", }; export default storyConfig; @@ -11,17 +11,17 @@ export default storyConfig; const testOptions = { xAxis: { type: "category", - data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"] + data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], }, yAxis: { - type: "value" + type: "value", }, series: [ { data: [150, 230, 224, 218, 135, 147, 260], - type: "line" - } - ] + type: "line", + }, + ], }; // EChartWrapper Template @@ -29,4 +29,4 @@ const EChartWrapperTemplate: ComponentStory = (args) => = (args) => ; + +export const Default = FabTemplate.bind({}); +Default.args = { position: "bottom-right", children: "Fab" }; diff --git a/stories/atoms/favorite-selector.stories.tsx b/stories/atoms/favorite-selector.stories.tsx index 3f501d1668..11ad3399ab 100644 --- a/stories/atoms/favorite-selector.stories.tsx +++ b/stories/atoms/favorite-selector.stories.tsx @@ -1,21 +1,19 @@ import { ComponentStory } from "@storybook/react"; import FavoriteSelector from "components/atoms/FavoriteSelector/favorite-selector"; - const StoryConfig = { - title: "Design System/Atoms/FavoriteSelector" - + title: "Design System/Atoms/FavoriteSelector", }; export default StoryConfig; -const FavoriteSelectorTemplate: ComponentStory = (args)=> ; +const FavoriteSelectorTemplate: ComponentStory = (args) => ; export const Filled = FavoriteSelectorTemplate.bind({}); Filled.args = { - isFavorite: true + isFavorite: true, }; export const OutLined = FavoriteSelectorTemplate.bind({}); OutLined.args = { - isFavorite: false + isFavorite: false, }; diff --git a/stories/atoms/filterCard.stories.tsx b/stories/atoms/filterCard.stories.tsx index 63dce89df3..c0b13fc63a 100644 --- a/stories/atoms/filterCard.stories.tsx +++ b/stories/atoms/filterCard.stories.tsx @@ -1,25 +1,23 @@ import { ComponentStory } from "@storybook/react"; import FilterCard from "../../components/atoms/FilterCard/filter-card"; - const storyConfig = { title: "Design System/Atoms/FilterCard", component: "FilterCard", argTypes: { isRemovable: { options: [true, false], - control: { type: "radio" } + control: { type: "radio" }, }, icon: { options: ["repo", "topic", "org", "contributor"], - control: { type: "select" } - } - } + control: { type: "select" }, + }, + }, }; export default storyConfig; - // FilterCard Template const FilterCardTemplate: ComponentStory = (args) => ; @@ -29,4 +27,4 @@ Default.args = { filterName: "hacktoberfest", isRemovable: false }; // FilterCard Removable export const Removable = FilterCardTemplate.bind({}); -Removable.args = { filterName: "hacktoberfest", isRemovable: true }; \ No newline at end of file +Removable.args = { filterName: "hacktoberfest", isRemovable: true }; diff --git a/stories/atoms/icon-button.stories.tsx b/stories/atoms/icon-button.stories.tsx index 324590f19b..2b678de5ce 100644 --- a/stories/atoms/icon-button.stories.tsx +++ b/stories/atoms/icon-button.stories.tsx @@ -3,7 +3,7 @@ import IconButton from "../../components/atoms/IconButton/icon-button"; const storyConfig = { title: "Design System/Atoms/Icon Button", - component: "Icon Button" + component: "Icon Button", }; export default storyConfig; @@ -12,4 +12,4 @@ export default storyConfig; const IconButtonTemplate: ComponentStory = (args) => ; export const Default = IconButtonTemplate.bind({}); -Default.args = { }; \ No newline at end of file +Default.args = {}; diff --git a/stories/atoms/icon.stories.tsx b/stories/atoms/icon.stories.tsx index 5967ad10f1..778165e79f 100644 --- a/stories/atoms/icon.stories.tsx +++ b/stories/atoms/icon.stories.tsx @@ -4,7 +4,7 @@ import Icon from "../../components/atoms/Icon/icon"; const storyConfig = { title: "Design System/Atoms/Icon", - component: "Icon Button" + component: "Icon Button", }; export default storyConfig; diff --git a/stories/atoms/insight-badge.stories.tsx b/stories/atoms/insight-badge.stories.tsx index 90b8ee42ed..7d223a8aed 100644 --- a/stories/atoms/insight-badge.stories.tsx +++ b/stories/atoms/insight-badge.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import InsightsBadge from "components/atoms/InsightBadge/insight-badge"; const storyConfig = { - title: "Design System/Atoms/InsightsBadge" + title: "Design System/Atoms/InsightsBadge", }; export default storyConfig; diff --git a/stories/atoms/insights-page-list-item.stories.tsx b/stories/atoms/insights-page-list-item.stories.tsx index b179909049..d41d43628f 100644 --- a/stories/atoms/insights-page-list-item.stories.tsx +++ b/stories/atoms/insights-page-list-item.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import InsightsPageListItem from "components/atoms/InsightsPageListItem/insights-page-list-item"; const storyConfig = { - title: "Design System/Atoms/InsightsPageListItem" + title: "Design System/Atoms/InsightsPageListItem", }; export default storyConfig; @@ -14,5 +14,5 @@ export const DefaultStory = InsightsPageListItemTemplate.bind({}); DefaultStory.args = { pageId: "kwjofijewew", - pageName: "Insights team" + pageName: "Insights team", }; diff --git a/stories/atoms/language-pill.stories.tsx b/stories/atoms/language-pill.stories.tsx index 1d9f619c09..861c899ad1 100644 --- a/stories/atoms/language-pill.stories.tsx +++ b/stories/atoms/language-pill.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import LanguagePill from "components/atoms/LanguagePill/LanguagePill"; const Storyconfig = { - title: "Design System/Atoms/LanguagePill" + title: "Design System/Atoms/LanguagePill", }; export default Storyconfig; @@ -12,11 +12,11 @@ export const LanguagePillDefault = LanguagePillTemplate.bind({}); export const LanguagePillSelected = LanguagePillTemplate.bind({}); LanguagePillDefault.args = { - topic: "javascript" + topic: "javascript", }; LanguagePillSelected.args = { topic: "python", - classNames: "bg-light-orange-10 text-white" + classNames: "bg-light-orange-10 text-white", }; diff --git a/stories/atoms/layout-toggle.stories.tsx b/stories/atoms/layout-toggle.stories.tsx index 337f00b35b..fa6f0c0e26 100644 --- a/stories/atoms/layout-toggle.stories.tsx +++ b/stories/atoms/layout-toggle.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import LayoutToggle from "components/atoms/LayoutToggle/layout-toggle"; const storyConfig = { - title: "Design System/Atoms/LayoutToggle" + title: "Design System/Atoms/LayoutToggle", }; export default storyConfig; @@ -12,5 +12,5 @@ export const Default = LayoutToggleTemplate.bind({}); Default.args = { onChange: (value) => console.log(value), - value: "grid" + value: "grid", }; diff --git a/stories/atoms/limit-select.stories.tsx b/stories/atoms/limit-select.stories.tsx index 629e33d200..f5c687c15a 100644 --- a/stories/atoms/limit-select.stories.tsx +++ b/stories/atoms/limit-select.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import LimitSelect from "components/atoms/Select/limit-select"; const StoryConfig = { - title: "Design System/Atoms/Limit Select" + title: "Design System/Atoms/Limit Select", }; export default StoryConfig; @@ -19,7 +19,7 @@ Default.args = { options: [ { name: "select", value: "select" }, { name: "food", value: "food" }, - { name: "fruit", value: "fruit" } + { name: "fruit", value: "fruit" }, ], - placeholder: "Select an option" + placeholder: "Select an option", }; diff --git a/stories/atoms/pill-selector.stories.tsx b/stories/atoms/pill-selector.stories.tsx index c7a170c183..bf262de0bc 100644 --- a/stories/atoms/pill-selector.stories.tsx +++ b/stories/atoms/pill-selector.stories.tsx @@ -3,7 +3,7 @@ import PillSelector from "../../components/atoms/PillSelector/pill-selector"; const storyConfig = { title: "Design System/Atoms/PillSelector", - component: "PillSelector" + component: "PillSelector", }; const filterOptions = ["Top 1k Repos", "Minimum 5 Contributors", "1k Stars", "Most Active", "Most Spammed"]; diff --git a/stories/atoms/pill.stories.tsx b/stories/atoms/pill.stories.tsx index 3216d17db8..e7994c35f4 100644 --- a/stories/atoms/pill.stories.tsx +++ b/stories/atoms/pill.stories.tsx @@ -9,13 +9,13 @@ const storyConfig = { argTypes: { color: { options: ["slate", "green", "yellow", "red"], - control: { type: "select" } + control: { type: "select" }, }, size: { options: ["base", "small"], - control: { type: "select" } - } - } + control: { type: "select" }, + }, + }, }; export default storyConfig; @@ -59,4 +59,4 @@ const IconPills: ComponentStory = (args) => ( ); -export const HasIcon = IconPills.bind({}); \ No newline at end of file +export const HasIcon = IconPills.bind({}); diff --git a/stories/atoms/progress-pie.stories.tsx b/stories/atoms/progress-pie.stories.tsx index 184b747883..9df14e27d0 100644 --- a/stories/atoms/progress-pie.stories.tsx +++ b/stories/atoms/progress-pie.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ProgressPie from "../../components/atoms/ProgressPie/progress-pie"; const storyConfig = { - title: "Design System/Atoms/ProgressPie" + title: "Design System/Atoms/ProgressPie", }; export default storyConfig; @@ -10,4 +10,4 @@ export default storyConfig; const ProgressPieTemplate: ComponentStory = (args) => ; export const Default = ProgressPieTemplate.bind({}); -Default.args = { percentage: 32 }; \ No newline at end of file +Default.args = { percentage: 32 }; diff --git a/stories/atoms/pull-request-overview-chart.stories.tsx b/stories/atoms/pull-request-overview-chart.stories.tsx index c7c357b014..054238ff00 100644 --- a/stories/atoms/pull-request-overview-chart.stories.tsx +++ b/stories/atoms/pull-request-overview-chart.stories.tsx @@ -3,13 +3,15 @@ import PullRequestOverviewChart from "components/atoms/PullRequestOverviewChart/ const storyConfig = { title: "Design System/Atoms/Pull Request Overview Chart", - component: "PullRequestOverviewChart" + component: "PullRequestOverviewChart", }; export default storyConfig; //PullRequestOverviewChart Template -const PullRequestOverviewChartTemplate: ComponentStory = (args) => ; +const PullRequestOverviewChartTemplate: ComponentStory = (args) => ( + +); export const Default = PullRequestOverviewChartTemplate.bind({}); @@ -17,5 +19,5 @@ Default.args = { open: 2, merged: 28, closed: 3, - draft: 38 -}; \ No newline at end of file + draft: 38, +}; diff --git a/stories/atoms/radio-check.stories.tsx b/stories/atoms/radio-check.stories.tsx index a38979d833..85fbb4fd23 100644 --- a/stories/atoms/radio-check.stories.tsx +++ b/stories/atoms/radio-check.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import RadioCheck from "components/atoms/RadioCheck/radio-check"; const storyConfig = { - title: "Design System/Atoms/Radio Check" + title: "Design System/Atoms/Radio Check", }; export default storyConfig; @@ -12,9 +12,9 @@ export const Checked = RadioTemplate.bind({}); Checked.args = { children: "Test", checked: true, - className: "w-full" + className: "w-full", }; Default.args = { children: "Test", - className: "w-max" + className: "w-max", }; diff --git a/stories/atoms/radio.stories.tsx b/stories/atoms/radio.stories.tsx index 7232285af5..6e4550d240 100644 --- a/stories/atoms/radio.stories.tsx +++ b/stories/atoms/radio.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import Radio from "components/atoms/Radio/radio"; const storyConfig = { - title: "Design System/Atoms/Radio" + title: "Design System/Atoms/Radio", }; export default storyConfig; @@ -13,10 +13,10 @@ Checked.args = { children: "Test", checked: true, withLabel: "32k", - className: "w-full" + className: "w-full", }; Default.args = { children: "Test", id: "select", - className: "w-max" + className: "w-max", }; diff --git a/stories/atoms/search.stories.tsx b/stories/atoms/search.stories.tsx index 9d4a3ab363..08616169b8 100644 --- a/stories/atoms/search.stories.tsx +++ b/stories/atoms/search.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import Search from "components/atoms/Search/search"; const StoryConfig = { - title: "Design System/Atoms/Search" + title: "Design System/Atoms/Search", }; export default StoryConfig; @@ -14,15 +14,15 @@ export const WithSuggestions = SearchTemplate.bind({}); Default.args = { placeholder: "Search repositories", - name: "Search" + name: "Search", }; Focused.args = { placeholder: "Search repositories", name: "Search", - autoFocus: true + autoFocus: true, }; WithSuggestions.args = { placeholder: "Search repositories", name: "Search", - suggestions: ["openarch/north", "opencv/opencv", "openmusic5/featurecity"] + suggestions: ["openarch/north", "opencv/opencv", "openmusic5/featurecity"], }; diff --git a/stories/atoms/select.stories.tsx b/stories/atoms/select.stories.tsx index dc4db2d71f..8a8f5f9b2b 100644 --- a/stories/atoms/select.stories.tsx +++ b/stories/atoms/select.stories.tsx @@ -3,7 +3,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "c const storyConfig = { title: "Design System/Atoms/Select", - component: "Select" + component: "Select", }; const SelectOptions = ["test", "Main", "Beta"]; diff --git a/stories/atoms/skeleton-wrapper.stories.tsx b/stories/atoms/skeleton-wrapper.stories.tsx index 4307f0bd37..8098a4b989 100644 --- a/stories/atoms/skeleton-wrapper.stories.tsx +++ b/stories/atoms/skeleton-wrapper.stories.tsx @@ -3,7 +3,7 @@ import SkeletonWrapper from "components/atoms/SkeletonLoader/skeleton-wrapper"; const storyConfig = { title: "Design System/Atoms/Skeleton Wrapper", - component: "SkeletonWrapper" + component: "SkeletonWrapper", }; export default storyConfig; @@ -19,19 +19,19 @@ Default.args = { count: 1, height: 180, width: 300, - radius: 4 + radius: 4, }; doubleWrappers.args = { count: 2, height: 90, width: 300, - radius: 4 + radius: 4, }; tripleWrappers.args = { count: 3, height: 60, width: 300, - radius: 4 + radius: 4, }; diff --git a/stories/atoms/sparkline.stories.tsx b/stories/atoms/sparkline.stories.tsx index 6ee32443b8..b321c39744 100644 --- a/stories/atoms/sparkline.stories.tsx +++ b/stories/atoms/sparkline.stories.tsx @@ -3,14 +3,14 @@ import Sparkline from "../../components/atoms/Sparkline/sparkline"; const storyConfig = { Sparkline: "Design System/Atoms/Sparkline", - component: "Sparkline" + component: "Sparkline", }; export default storyConfig; //Sparkline Template const SparklineTemplate: ComponentStory = (args) => ( -
+
); @@ -20,78 +20,78 @@ export const Default = SparklineTemplate.bind({}); Default.args = { data: [ { - "id": "japan", - "color": "hsl(63, 70%, 50%)", - "data": [ + id: "japan", + color: "hsl(63, 70%, 50%)", + data: [ { - "x": "plane", - "y": 287 + x: "plane", + y: 287, }, { - "x": "helicopter", - "y": 183 + x: "helicopter", + y: 183, }, { - "x": "boat", - "y": 112 + x: "boat", + y: 112, }, { - "x": "train", - "y": 78 + x: "train", + y: 78, }, { - "x": "subway", - "y": 47 + x: "subway", + y: 47, }, { - "x": "bus", - "y": 218 + x: "bus", + y: 218, }, { - "x": "car", - "y": 106 + x: "car", + y: 106, }, { - "x": "moto", - "y": 190 + x: "moto", + y: 190, }, { - "x": "bicycle", - "y": 88 + x: "bicycle", + y: 88, }, { - "x": "horse", - "y": 8 + x: "horse", + y: 8, }, { - "x": "skateboard", - "y": 248 + x: "skateboard", + y: 248, }, { - "x": "others", - "y": 76 + x: "others", + y: 76, }, { - "x": "adwawd", - "y": 76 + x: "adwawd", + y: 76, }, { - "x": "awdawdd", - "y": 38 + x: "awdawdd", + y: 38, }, { - "x": "awd", - "y": 42 + x: "awd", + y: 42, }, { - "x": "adwadadw", - "y": 26 + x: "adwadadw", + y: 26, }, { - "x": "dadawda", - "y": 76 - } - ] - } - ] -}; \ No newline at end of file + x: "dadawda", + y: 76, + }, + ], + }, + ], +}; diff --git a/stories/atoms/spinner.stories.tsx b/stories/atoms/spinner.stories.tsx index ad30f2f905..b0e17d0db5 100644 --- a/stories/atoms/spinner.stories.tsx +++ b/stories/atoms/spinner.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import SpinLoader from "components/atoms/SpinLoader/spin-loader"; const storyConfig = { - title: "Design System/Atoms/SpinLoader" + title: "Design System/Atoms/SpinLoader", }; export default storyConfig; diff --git a/stories/atoms/team-member-row.stories.tsx b/stories/atoms/team-member-row.stories.tsx index c5d7e700cb..d79c284c12 100644 --- a/stories/atoms/team-member-row.stories.tsx +++ b/stories/atoms/team-member-row.stories.tsx @@ -3,7 +3,7 @@ import TeamMemberRow from "components/molecules/TeamMemberRow/team-member-row"; const storyConfig = { title: "Design System/Molecules/Team Member Row", - component: "TeamMemberRow" + component: "TeamMemberRow", }; export default storyConfig; @@ -20,23 +20,23 @@ Default.args = { className: "max-w-2xl", name: "John Doe", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", - access: "admin" + access: "admin", }; Editor.args = { className: "max-w-2xl", name: "John Doe", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", - access: "edit" + access: "edit", }; Viewer.args = { className: "max-w-2xl", name: "John Doe", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", - access: "view" + access: "view", }; Pending.args = { className: "max-w-2xl", name: "John Doe", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", - access: "pending" + access: "pending", }; diff --git a/stories/atoms/team-members-config.stories.tsx b/stories/atoms/team-members-config.stories.tsx index 658627ac22..9e2ea227f4 100644 --- a/stories/atoms/team-members-config.stories.tsx +++ b/stories/atoms/team-members-config.stories.tsx @@ -3,7 +3,7 @@ import TeamMembersConfig from "components/molecules/TeamMembersConfig/team-membe const storyConfig = { title: "Design System/Molecules/Team Members Config", - component: "TeamMembersConfig" + component: "TeamMembersConfig", }; export default storyConfig; @@ -20,21 +20,21 @@ Default.args = { avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", access: "admin", id: "3", - insight_id: 3 + insight_id: 3, }, { name: "John Cena", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", access: "edit", id: "4", - insight_id: 4 + insight_id: 4, }, { name: "John Wick", avatarUrl: "https://avatars.githubusercontent.com/u/7252105?v=4", access: "view", id: "5", - insight_id: 5 - } - ] + insight_id: 5, + }, + ], }; diff --git a/stories/atoms/text-input.stories.tsx b/stories/atoms/text-input.stories.tsx index b350d50be0..c26a648b5a 100644 --- a/stories/atoms/text-input.stories.tsx +++ b/stories/atoms/text-input.stories.tsx @@ -4,15 +4,13 @@ import TextInput from "components/atoms/TextInput/text-input"; const storyConfig = { title: "Design System/Atoms/Text Input", - component: "TextInput" + component: "TextInput", }; export default storyConfig; //TextInput Template -const TextInputTemplate: ComponentStory = (args) => ( - -); +const TextInputTemplate: ComponentStory = (args) => ; export const Default = TextInputTemplate.bind({}); export const WithLabel = TextInputTemplate.bind({}); @@ -23,21 +21,21 @@ Default.args = { placeholder: "Test", disabled: false, autoFocus: true, - borderless: false + borderless: false, }; WithLabel.args = { placeholder: "Test", disabled: false, autoFocus: true, borderless: false, - label: "Input label" + label: "Input label", }; WithDescriptionText.args = { placeholder: "Test", disabled: false, autoFocus: true, borderless: false, - descriptionText: "insights.opensauced.pizza/statelyai/slug" + descriptionText: "insights.opensauced.pizza/statelyai/slug", }; IsInvalid.args = { @@ -46,12 +44,12 @@ IsInvalid.args = { autoFocus: true, borderless: false, state: "invalid", - errorMsg: "An error occured !!!" + errorMsg: "An error occured !!!", }; IsValid.args = { placeholder: "Test", disabled: false, autoFocus: true, borderless: false, - state: "valid" + state: "valid", }; diff --git a/stories/atoms/text.stories.tsx b/stories/atoms/text.stories.tsx index 386496917c..bfae08c528 100644 --- a/stories/atoms/text.stories.tsx +++ b/stories/atoms/text.stories.tsx @@ -3,7 +3,7 @@ import Text from "../../components/atoms/Typography/text"; const storyConfig = { title: "Design System/Atoms/Text", - component: "Text" + component: "Text", }; export default storyConfig; @@ -20,5 +20,5 @@ Default.args = { strikethrough: false, underline: false, small: false, - disabled: false -}; \ No newline at end of file + disabled: false, +}; diff --git a/stories/atoms/title.stories.tsx b/stories/atoms/title.stories.tsx index ecc5a71513..9149d1fe69 100644 --- a/stories/atoms/title.stories.tsx +++ b/stories/atoms/title.stories.tsx @@ -3,7 +3,7 @@ import Title from "../../components/atoms/Typography/title"; const storyConfig = { title: "Design System/Atoms/Title", - component: "Title" + component: "Title", }; export default storyConfig; @@ -15,5 +15,5 @@ export const Default = TitleTemplate.bind({}); Default.args = { children: "Test", - level: 1 -}; \ No newline at end of file + level: 1, +}; diff --git a/stories/atoms/toggle-group.stories.tsx b/stories/atoms/toggle-group.stories.tsx index b557195d5c..9cbe8a8489 100644 --- a/stories/atoms/toggle-group.stories.tsx +++ b/stories/atoms/toggle-group.stories.tsx @@ -3,7 +3,7 @@ import { ComponentStory } from "@storybook/react"; import ToggleGroup from "components/atoms/ToggleGroup/toggle-group"; const storyConfig = { - title: "Design System/Atoms/ToggleGroup" + title: "Design System/Atoms/ToggleGroup", }; export default storyConfig; @@ -13,29 +13,30 @@ export const Default = ToggleSwitchTemplate.bind({}); export const AllowNone = ToggleSwitchTemplate.bind({}); export const CustomItems = ToggleSwitchTemplate.bind({}); Default.args = { - children: [ - <>Option 1, - <>Option 2, - <>Option 3 - ], + children: [<>Option 1, <>Option 2, <>Option 3], defaultSelection: "0", - className: "w-max" + className: "w-max", }; AllowNone.args = { - children: [ - <>Option 1, - <>Option 2, - <>Option 3 - ], + children: [<>Option 1, <>Option 2, <>Option 3], allowNone: true, - className: "w-max" + className: "w-max", }; CustomItems.args = { children: [ -
Option 1 w\ link
, -

Option 2 w\ strong

, -
Option 3 w\
div
+
+ Option 1 w\{" "} + + link + +
, +

+ Option 2 w\ strong +

, +
+ Option 3 w\
div
+
, ], defaultSelection: "0", - className: "w-max" + className: "w-max", }; diff --git a/stories/atoms/toggle-option.stories.tsx b/stories/atoms/toggle-option.stories.tsx index 72ca8e0773..b92067a5ea 100644 --- a/stories/atoms/toggle-option.stories.tsx +++ b/stories/atoms/toggle-option.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ToggleOption from "components/atoms/ToggleOption/toggle-option"; const storyConfig = { - title: "Design System/Atoms/ToggleOption" + title: "Design System/Atoms/ToggleOption", }; export default storyConfig; @@ -11,9 +11,9 @@ const ToggleOptionTemplate: ComponentStory = (args) => = (args) => ( - - + + ); export const WithReportsHistory = AuthContentWrapperTemplateWithReportsHistory.bind({}); WithReportsHistory.args = { - reportList: testReportList -}; \ No newline at end of file + reportList: testReportList, +}; diff --git a/stories/molecules/auth-section.stories.tsx b/stories/molecules/auth-section.stories.tsx index 7ca1768130..5e63b1ee0f 100644 --- a/stories/molecules/auth-section.stories.tsx +++ b/stories/molecules/auth-section.stories.tsx @@ -2,19 +2,23 @@ import { ComponentStory } from "@storybook/react"; import AuthSection from "../../components/molecules/AuthSection/auth-section"; const storyConfig = { - title: "Design System/Molecules/Auth Section" + title: "Design System/Molecules/Auth Section", }; export default storyConfig; const testUser = { - testAttr: false + testAttr: false, }; -const AuthSectionTemplate: ComponentStory = (args) =>
; +const AuthSectionTemplate: ComponentStory = (args) => ( +
+ +
+); export const NoAuthedUser = AuthSectionTemplate.bind({}); -NoAuthedUser.args = { }; +NoAuthedUser.args = {}; export const AuthedUser = AuthSectionTemplate.bind({}); -AuthedUser.args = { user: testUser }; \ No newline at end of file +AuthedUser.args = { user: testUser }; diff --git a/stories/molecules/avatar-roll.stories.tsx b/stories/molecules/avatar-roll.stories.tsx index f793dd903b..7537e3eb61 100644 --- a/stories/molecules/avatar-roll.stories.tsx +++ b/stories/molecules/avatar-roll.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import AvatarRoll from "components/molecules/AvatarRoll/avatar-roll"; const StoryConfig = { - title: "Design System/Molecules/AvatarRoll" + title: "Design System/Molecules/AvatarRoll", }; export default StoryConfig; diff --git a/stories/molecules/card-horizontal-bar.stories.tsx b/stories/molecules/card-horizontal-bar.stories.tsx index 338118f729..90654de620 100644 --- a/stories/molecules/card-horizontal-bar.stories.tsx +++ b/stories/molecules/card-horizontal-bar.stories.tsx @@ -3,7 +3,7 @@ import { TooltipProvider } from "@radix-ui/react-tooltip"; import CardHorizontalBarChart from "components/molecules/CardHorizontalBarChart/card-horizontal-bar-chart"; const storyConfig = { title: "Design System/Molecules/Card Horizontal Bar", - component: "CardHorizontalBar" + component: "CardHorizontalBar", }; export default storyConfig; @@ -11,17 +11,17 @@ export default storyConfig; export const testLanguageList = [ { languageName: "TypeScript", - percentageUsed: 50 + percentageUsed: 50, }, { languageName: "JavaScript", - percentageUsed: 20 + percentageUsed: 20, }, { languageName: "Rust", - percentageUsed: 15 + percentageUsed: 15, }, - { languageName: "React", percentageUsed: 15 } + { languageName: "React", percentageUsed: 15 }, ]; //CardHorizontalBarChart Template @@ -37,15 +37,15 @@ OneLanguage.args = { languageList: [ { languageName: "JavaScript", - percentageUsed: 100 - } - ] + percentageUsed: 100, + }, + ], }; export const MultipleLanguages = CardHorizontalBarTemplate.bind({}); MultipleLanguages.args = { - languageList: testLanguageList + languageList: testLanguageList, }; export const notSupportedLanguage = CardHorizontalBarTemplate.bind({}); @@ -53,7 +53,7 @@ notSupportedLanguage.args = { languageList: [ { languageName: "qBasic", - percentageUsed: 100 - } - ] + percentageUsed: 100, + }, + ], }; diff --git a/stories/molecules/card-line-chart.stories.tsx b/stories/molecules/card-line-chart.stories.tsx index fea10d2816..946ad949ed 100644 --- a/stories/molecules/card-line-chart.stories.tsx +++ b/stories/molecules/card-line-chart.stories.tsx @@ -3,17 +3,17 @@ import CardLineChart from "components/molecules/CardLineChart/card-line-chart"; const storyConfig = { title: "Design System/Molecules/Card Line Chart", - component: "ScatterChart" + component: "ScatterChart", }; export default storyConfig; -const testOptions = { +const testOptions = { grid: { left: 40, top: 10, right: 40, - bottom: 20 + bottom: 20, }, xAxis: { type: "category", @@ -21,21 +21,21 @@ const testOptions = { axisLabel: { fontSize: 14, fontWeight: "bold", - color: "darkgray" + color: "darkgray", }, - data: ["Jan 2022", "Mar 2022", "Jun 2022"] + data: ["Jan 2022", "Mar 2022", "Jun 2022"], }, yAxis: { type: "value", splitNumber: 1, axisLabel: { - show: false + show: false, }, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, series: [ { @@ -44,14 +44,14 @@ const testOptions = { smooth: true, showSymbol: false, lineStyle: { - color: "#ff9800" + color: "#ff9800", }, areaStyle: { color: "#FFB74D", - opacity: 0.6 - } - } - ] + opacity: 0.6, + }, + }, + ], }; // ScatterChart Template @@ -59,4 +59,4 @@ const CardLineChartTemplate: ComponentStory = (args) => = (args) => console.log("i was click") + setRangeFilter: () => console.log("i was click"), }; diff --git a/stories/molecules/component-gradient.stories.tsx b/stories/molecules/component-gradient.stories.tsx index c27c808c17..0f21747e02 100644 --- a/stories/molecules/component-gradient.stories.tsx +++ b/stories/molecules/component-gradient.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ComponentGradient from "components/molecules/ComponentGradient/component-gradient"; const StoryConfig = { - title: "Design System/Molecules/ComponentGradient" + title: "Design System/Molecules/ComponentGradient", }; export default StoryConfig; const ComponentGradientTemplate: ComponentStory = (args) => ; diff --git a/stories/molecules/component-header.stories.tsx b/stories/molecules/component-header.stories.tsx index 424bd56fc5..47c1415eda 100644 --- a/stories/molecules/component-header.stories.tsx +++ b/stories/molecules/component-header.stories.tsx @@ -3,7 +3,7 @@ import ComponentHeader from "../../components/molecules/ComponentHeader/componen const storyConfig = { title: "Design System/Molecules/Component Header", - component: "ComponentHeader" + component: "ComponentHeader", }; export default storyConfig; @@ -13,4 +13,4 @@ const ComponentHeaderTemplate: ComponentStory = (args) = // ComponentHeader Default export const Default = ComponentHeaderTemplate.bind({}); -Default.args = {title: "Test Title" }; \ No newline at end of file +Default.args = { title: "Test Title" }; diff --git a/stories/molecules/context-clue-card.stories.tsx b/stories/molecules/context-clue-card.stories.tsx index e3b05eafb4..1dbb705b8e 100644 --- a/stories/molecules/context-clue-card.stories.tsx +++ b/stories/molecules/context-clue-card.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ContextClueCard from "components/molecules/ContextClueCard/context-clue-card"; const storyConfig = { - title: "Design System/Molecules/ContextClueCard" + title: "Design System/Molecules/ContextClueCard", }; export default storyConfig; @@ -12,5 +12,5 @@ export const DefaultStory = ContextClueCardTemplate.bind({}); DefaultStory.args = { title: "Title", - desc: "Lorem ipsum dolor sit amet consectetur. Tempus nascetur in nisl justo posuere lacinia blandit mi. Arcu eget tellus nibh pharetra est aliquam turpis. Penatibus in vulputate dui egestas vestibulum id pharetra. A urna donec in pharetra eu nec." + desc: "Lorem ipsum dolor sit amet consectetur. Tempus nascetur in nisl justo posuere lacinia blandit mi. Arcu eget tellus nibh pharetra est aliquam turpis. Penatibus in vulputate dui egestas vestibulum id pharetra. A urna donec in pharetra eu nec.", }; diff --git a/stories/molecules/contributor-filter-dropdown.stories.tsx b/stories/molecules/contributor-filter-dropdown.stories.tsx index eaf24bf4c3..74d604293b 100644 --- a/stories/molecules/contributor-filter-dropdown.stories.tsx +++ b/stories/molecules/contributor-filter-dropdown.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ContributorFilterDropdown from "components/molecules/ContributorFilterDropdown/contributor-filter-dropdown"; const storyConfig = { - title: "Design System/Molecules/ContributorFilterDropdown" + title: "Design System/Molecules/ContributorFilterDropdown", }; export default storyConfig; diff --git a/stories/molecules/contributor-hover-card.stories.tsx b/stories/molecules/contributor-hover-card.stories.tsx index 19dc955457..6a74b64d96 100644 --- a/stories/molecules/contributor-hover-card.stories.tsx +++ b/stories/molecules/contributor-hover-card.stories.tsx @@ -3,7 +3,7 @@ import { TipProvider } from "components/atoms/Tooltip/tooltip"; import ContributorHoverCard from "components/molecules/ContributorHoverCard/contributor-hover-card"; const storyConfig = { - title: "Design System/Molecules/ContributorHoverCard" + title: "Design System/Molecules/ContributorHoverCard", }; export default storyConfig; @@ -19,5 +19,5 @@ ScatterChartTooltipStory.args = { repoList: [], githubName: "SunGoldTech", totalPR: 23, - dateOfFirstPr: "3mo" + dateOfFirstPr: "3mo", }; diff --git a/stories/molecules/contributor-profile-header.stories.tsx b/stories/molecules/contributor-profile-header.stories.tsx index eff70afad3..c62d2b8df0 100644 --- a/stories/molecules/contributor-profile-header.stories.tsx +++ b/stories/molecules/contributor-profile-header.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import ContributorProfileHeader from "components/molecules/ContributorProfileHeader/contributor-profile-header"; const storyConfig = { - title: "Design System/Molecules/Contributor Profile Header" + title: "Design System/Molecules/Contributor Profile Header", }; export default storyConfig; @@ -15,5 +15,5 @@ export const ContributorProfileHeaderStory = ContributorProfileHeaderTemplate.bi ContributorProfileHeaderStory.args = { avatarUrl: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", - isConnected: true + isConnected: true, }; diff --git a/stories/molecules/contributor-table.stories.tsx b/stories/molecules/contributor-table.stories.tsx index e69c801dba..75ebdd8195 100644 --- a/stories/molecules/contributor-table.stories.tsx +++ b/stories/molecules/contributor-table.stories.tsx @@ -4,7 +4,7 @@ import PullRequestTable from "components/molecules/PullRequestTable/pull-request const storyConfig = { title: "Design System/Molecules/Contributor Table", - component: "Card Table" + component: "Card Table", }; export default storyConfig; @@ -16,7 +16,7 @@ const testPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -24,7 +24,7 @@ const testPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -32,7 +32,7 @@ const testPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -40,8 +40,8 @@ const testPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 - } + noOfLinesChanged: 837, + }, ]; //CardTable Template @@ -50,8 +50,6 @@ const PullRequestTableTemplate: ComponentStory = (args) export const AddedPullRequests = PullRequestTableTemplate.bind({}); export const NoPullRequests = PullRequestTableTemplate.bind({}); -AddedPullRequests.args = { -}; +AddedPullRequests.args = {}; -NoPullRequests.args = { -}; +NoPullRequests.args = {}; diff --git a/stories/molecules/dashboard-scatter-chart.stories.tsx b/stories/molecules/dashboard-scatter-chart.stories.tsx index 1a75a143d5..477bb1f220 100644 --- a/stories/molecules/dashboard-scatter-chart.stories.tsx +++ b/stories/molecules/dashboard-scatter-chart.stories.tsx @@ -4,7 +4,7 @@ import DashboardScatterChart from "../../components/molecules/DashboardScatterCh const storyConfig = { title: "Design System/Molecules/Dashboard Scatter Chart", - component: "ScatterChart" + component: "ScatterChart", }; export default storyConfig; @@ -14,7 +14,7 @@ const testOptions = { left: 40, top: 10, right: 40, - bottom: 20 + bottom: 20, }, xAxis: { boundaryGap: false, @@ -25,13 +25,13 @@ const testOptions = { max: 35, axisLabel: { formatter: (value: number, index: number) => - value === 0 ? "Today" : value === 35 ? "35+ days ago" : `${value} days ago` + value === 0 ? "Today" : value === 35 ? "35+ days ago" : `${value} days ago`, }, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, yAxis: { min: 0, @@ -40,13 +40,13 @@ const testOptions = { boundaryGap: false, axisLabel: { showMinLabel: true, - formatter: (value: number) => (value >= 1000 ? humanizeNumber(value, null) : value) + formatter: (value: number) => (value >= 1000 ? humanizeNumber(value, null) : value), }, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, series: [ { @@ -73,11 +73,11 @@ const testOptions = { [12.0, 6.26], [12.0, 8.84], [7.08, 5.82], - [5.02, 5.68] + [5.02, 5.68], ], - type: "scatter" - } - ] + type: "scatter", + }, + ], }; const testOptionsWithImage = { @@ -85,7 +85,7 @@ const testOptionsWithImage = { left: 40, top: 10, right: 40, - bottom: 20 + bottom: 20, }, xAxis: { boundaryGap: false, @@ -95,13 +95,14 @@ const testOptionsWithImage = { min: 0, max: 35, axisLabel: { - formatter: (value: number, index: number) => value === 0 ? "Today" : value === 35 ? "35+ days ago" : `${value} days ago` + formatter: (value: number, index: number) => + value === 0 ? "Today" : value === 35 ? "35+ days ago" : `${value} days ago`, }, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, yAxis: { min: 0, @@ -110,18 +111,21 @@ const testOptionsWithImage = { boundaryGap: false, axisLabel: { showMinLabel: true, - formatter: (value: number)=> value >= 1000 ? humanizeNumber(value, null) : value + formatter: (value: number) => (value >= 1000 ? humanizeNumber(value, null) : value), }, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, series: [ { symbolSize: 30, - symbol: (value: number[]) => value[0] > 8 ? "image://https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80" : "circle", + symbol: (value: number[]) => + value[0] > 8 + ? "image://https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80" + : "circle", data: [ [10.0, 8.04], [8.07, 6.95], @@ -144,15 +148,17 @@ const testOptionsWithImage = { [12.0, 6.26], [12.0, 8.84], [7.08, 5.82], - [5.02, 5.68] + [5.02, 5.68], ], - type: "scatter" - } - ] + type: "scatter", + }, + ], }; // ScatterChart Template -const ScatterChartTemplate: ComponentStory = (args) => ; +const ScatterChartTemplate: ComponentStory = (args) => ( + +); // ScatterChart Default export const Default = ScatterChartTemplate.bind({}); diff --git a/stories/molecules/dropdown-list.stories.tsx b/stories/molecules/dropdown-list.stories.tsx index ce4dc05eec..f1808b4504 100644 --- a/stories/molecules/dropdown-list.stories.tsx +++ b/stories/molecules/dropdown-list.stories.tsx @@ -2,7 +2,7 @@ import Text from "components/atoms/Typography/text"; import DropdownList from "../../components/molecules/DropdownList/dropdown-list"; const storyConfig = { - title: "Design System/Molecules/Dropdown List" + title: "Design System/Molecules/Dropdown List", }; export default storyConfig; @@ -10,7 +10,11 @@ export default storyConfig; const testElement = [ Test - + , ]; -export const DropdownListMolecule = () =>
Hello
; \ No newline at end of file +export const DropdownListMolecule = () => ( +
+ Hello +
+); diff --git a/stories/molecules/dropdown-page-list-item.stories.tsx b/stories/molecules/dropdown-page-list-item.stories.tsx index 9220fdef11..be5a55d449 100644 --- a/stories/molecules/dropdown-page-list-item.stories.tsx +++ b/stories/molecules/dropdown-page-list-item.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import InsightsPageListDropdown from "components/molecules/InsightsPageListDropdown/insights-page-list-dropdown"; const storyConfig = { - title: "Design System/Molecules/InsightsPageListDropdown" + title: "Design System/Molecules/InsightsPageListDropdown", }; export default storyConfig; diff --git a/stories/molecules/favorite-repo-card.stories.tsx b/stories/molecules/favorite-repo-card.stories.tsx index 3f589b76c4..487f98283d 100644 --- a/stories/molecules/favorite-repo-card.stories.tsx +++ b/stories/molecules/favorite-repo-card.stories.tsx @@ -3,7 +3,7 @@ import FavoriteRepoCard from "components/molecules/FavoriteRepoCard/favorite-rep const storyConfig = { title: "Design System/Molecules/Favorite Repo Card", - component: "FavoriteRepoCard" + component: "FavoriteRepoCard", }; export default storyConfig; @@ -16,5 +16,5 @@ export const Default = FavoriteRepoCardTemplate.bind({}); Default.args = { name: "jsonhero-web", owner: "apihero-run", - avatarURL: "https://avatars.githubusercontent.com/u/7252105?v=4" + avatarURL: "https://avatars.githubusercontent.com/u/7252105?v=4", }; diff --git a/stories/molecules/favorite-repos.stories.tsx b/stories/molecules/favorite-repos.stories.tsx index a2ae829841..cb2222f167 100644 --- a/stories/molecules/favorite-repos.stories.tsx +++ b/stories/molecules/favorite-repos.stories.tsx @@ -3,7 +3,7 @@ import FavoriteRepos from "components/molecules/FavoriteRepos/favorite-repos"; const storyConfig = { title: "Design System/Molecules/Favorite Repos", - component: "FavoriteRepos" + component: "FavoriteRepos", }; export default storyConfig; @@ -19,19 +19,19 @@ Default.args = { name: "jsonhero-web", owner: "apihero-run", avatarURL: "https://avatars.githubusercontent.com/u/7252105?v=4", - topic: "javascript" + topic: "javascript", }, { name: "insights", owner: "opensauced", avatarURL: "https://avatars.githubusercontent.com/u/52013393?s=64&v=4", - topic: "javascript" + topic: "javascript", }, { name: "xstate", owner: "stately", avatarURL: "https://avatars.githubusercontent.com/u/69631?v=4", - topic: "javascript" - } - ] + topic: "javascript", + }, + ], }; diff --git a/stories/molecules/filter-card-select.stories.tsx b/stories/molecules/filter-card-select.stories.tsx index 728bc59d3b..6a005522fb 100644 --- a/stories/molecules/filter-card-select.stories.tsx +++ b/stories/molecules/filter-card-select.stories.tsx @@ -3,7 +3,7 @@ import FilterCardSelect from "components/molecules/FilterCardSelect/filter-card- const storyConfig = { title: "Design System/Molecules/FilterCardSelect", - component: "FilterCardSelect" + component: "FilterCardSelect", }; export default storyConfig; @@ -15,5 +15,5 @@ export const Default = SelectTemplate.bind({}); Default.args = { options: ["option1", "option2", "option3"], - selected: "option1" + selected: "option1", }; diff --git a/stories/molecules/highlight-card.stories.tsx b/stories/molecules/highlight-card.stories.tsx index 07af3afd0b..b565f06091 100644 --- a/stories/molecules/highlight-card.stories.tsx +++ b/stories/molecules/highlight-card.stories.tsx @@ -6,16 +6,16 @@ const storyConfig = { component: "HighlightCard", argTypes: { label: { - control: { type: "text" } + control: { type: "text" }, }, icon: { options: ["participation", "accepted-pr", "unlabeled-pr", "spam"], - control: { type: "select" } + control: { type: "select" }, }, url: { - control: { type: "text" } - } - } + control: { type: "text" }, + }, + }, }; export default storyConfig; @@ -25,24 +25,24 @@ const HighlightCardTemplate: ComponentStory = (args) => = (args) => ; export const Default = InsightPageTableTemplate.bind({}); Default.args = { - insights: [] - + insights: [], }; diff --git a/stories/molecules/nivo-scatter-chart.stories.tsx b/stories/molecules/nivo-scatter-chart.stories.tsx index 8ebeb449f8..4351786d4f 100644 --- a/stories/molecules/nivo-scatter-chart.stories.tsx +++ b/stories/molecules/nivo-scatter-chart.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import NivoScatterPlot from "components/molecules/NivoScatterChart/nivo-scatter-chart"; const storyConfig = { - title: "Design System/Molecules/ScatterChart" + title: "Design System/Molecules/ScatterChart", }; const data = [ @@ -15,9 +15,9 @@ const data = [ { x: 6.05, y: 8.03, image: "", contributor: "Sunday" }, { x: 10.02, y: 5.01, image: "", contributor: "Sunday" }, { x: 12.07, y: 9.08, image: "", contributor: "Sunday" }, - { x: 18.01, y: 12.04, image: "", contributor: "Sunday" } - ] - } + { x: 18.01, y: 12.04, image: "", contributor: "Sunday" }, + ], + }, ]; export default storyConfig; @@ -26,5 +26,5 @@ const ScatterChartTemplate: ComponentStory = (args) => < export const Scatterchart = ScatterChartTemplate.bind({}); Scatterchart.args = { - data: data + data: data, }; diff --git a/stories/molecules/onboarding-button.stories.tsx b/stories/molecules/onboarding-button.stories.tsx index c54ff7b4b4..bc3a77e5fe 100644 --- a/stories/molecules/onboarding-button.stories.tsx +++ b/stories/molecules/onboarding-button.stories.tsx @@ -2,15 +2,13 @@ import { ComponentStory } from "@storybook/react"; import OnboardingButton from "../../components/molecules/OnboardingButton/onboarding-button"; const StoryConfig = { - title: "Design System/Molecules/Onboarding Button" + title: "Design System/Molecules/Onboarding Button", }; export default StoryConfig; - const OnboardingButtonTemplate: ComponentStory = (args) => ; export const Default = OnboardingButtonTemplate.bind({}); -Default.args = { -}; +Default.args = {}; diff --git a/stories/molecules/page-header.stories.tsx b/stories/molecules/page-header.stories.tsx index 00b6c7a87a..5135c2d221 100644 --- a/stories/molecules/page-header.stories.tsx +++ b/stories/molecules/page-header.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import PageHeader from "components/molecules/PageHeader/page-header"; const StoryConfig = { - title: "Design System/Molecules/Page Header" + title: "Design System/Molecules/Page Header", }; export default StoryConfig; @@ -14,5 +14,5 @@ export const Default = PageHeaderTemplate.bind({}); Default.args = { title: "Repositories", leftComponent:
Left component
, - rightComponent:
Right component
+ rightComponent:
Right component
, }; diff --git a/stories/molecules/pagination-goto-page.stories.tsx b/stories/molecules/pagination-goto-page.stories.tsx index ebcecfb2b9..0fa3592b23 100644 --- a/stories/molecules/pagination-goto-page.stories.tsx +++ b/stories/molecules/pagination-goto-page.stories.tsx @@ -2,14 +2,14 @@ import { ComponentStory } from "@storybook/react"; import PaginationGotoPage from "components/molecules/PaginationGotoPage/pagination-goto-page"; const storyConfig = { - title: "Design System/Molecules/PaginationGotoPage" + title: "Design System/Molecules/PaginationGotoPage", }; export default storyConfig; -const PaginationGotoTemplate: ComponentStory = (args)=> ; +const PaginationGotoTemplate: ComponentStory = (args) => ; export const Default = PaginationGotoTemplate.bind({}); Default.args = { - page: 23 + page: 23, }; diff --git a/stories/molecules/pagination-result.stories.tsx b/stories/molecules/pagination-result.stories.tsx index a5e31d1cab..b3c6d2a315 100644 --- a/stories/molecules/pagination-result.stories.tsx +++ b/stories/molecules/pagination-result.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import PaginationResults from "components/molecules/PaginationResults/pagination-result"; const StoryConfig = { - title: "Design System/Molecules/Pagination result" + title: "Design System/Molecules/Pagination result", }; export default StoryConfig; @@ -13,5 +13,5 @@ export const PaginationResultStory = PaginationResultsTemplate.bind({}); PaginationResultStory.args = { metaInfo: { page: 2, pageCount: 3, hasNextPage: true, hasPreviousPage: false, itemCount: 34, limit: 10 }, total: 10000, - entity: "contributors" + entity: "contributors", }; diff --git a/stories/molecules/pagination.stories.tsx b/stories/molecules/pagination.stories.tsx index eb401e843b..24d701ab74 100644 --- a/stories/molecules/pagination.stories.tsx +++ b/stories/molecules/pagination.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import Pagination from "components/molecules/Pagination/pagination"; const StoryConfig = { - title: "Design System/Molecules/Pagination" + title: "Design System/Molecules/Pagination", }; export default StoryConfig; @@ -15,12 +15,11 @@ export const NoDivisor = PaginationTemplate.bind({}); Default.args = { pages: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], totalPage: 2003, - page: 5 + page: 5, }; NoDivisor.args = { pages: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], totalPage: 2003, page: 5, - divisor: false + divisor: false, }; - diff --git a/stories/molecules/pie-chart.stories.tsx b/stories/molecules/pie-chart.stories.tsx index 84688abdb5..4623e9e0f0 100644 --- a/stories/molecules/pie-chart.stories.tsx +++ b/stories/molecules/pie-chart.stories.tsx @@ -3,41 +3,40 @@ import PieChart from "components/molecules/PieChart/pie-chart"; import { PieData } from "components/molecules/PieChart/pie-chart"; const StoryConfig = { - title: "Design System/Molecules/PieChart" + title: "Design System/Molecules/PieChart", }; export default StoryConfig; -const PieChartData: PieData[] = [ +const PieChartData: PieData[] = [ { - "id": "open", - "label": "open", - "value": 8, - "color": "hsla(131, 41%, 46%, 1)" + id: "open", + label: "open", + value: 8, + color: "hsla(131, 41%, 46%, 1)", }, { - "id": "merged", - "label": "merged", - "value": 16, - "color": "hsla(272, 51%, 54%, 1)" + id: "merged", + label: "merged", + value: 16, + color: "hsla(272, 51%, 54%, 1)", }, { - "id": "closed", - "label": "closed", - "value": 8, - "color": "hsla(11, 89%, 54%, 1)" + id: "closed", + label: "closed", + value: 8, + color: "hsla(11, 89%, 54%, 1)", }, { - "id": "draft", - "label": "draft", - "value": 1, - "color": "hsla(205, 11%, 78%, 1)" - } + id: "draft", + label: "draft", + value: 1, + color: "hsla(205, 11%, 78%, 1)", + }, ]; - -const PieChartTemplate: ComponentStory = (args)=> ; +const PieChartTemplate: ComponentStory = (args) => ; export const PieChartStory = PieChartTemplate.bind({}); -PieChartStory.args ={ - data: PieChartData +PieChartStory.args = { + data: PieChartData, }; diff --git a/stories/molecules/profile-language-chart.stories.tsx b/stories/molecules/profile-language-chart.stories.tsx index c728c3aefc..c49d6b672b 100644 --- a/stories/molecules/profile-language-chart.stories.tsx +++ b/stories/molecules/profile-language-chart.stories.tsx @@ -4,7 +4,7 @@ import { ComponentStory } from "@storybook/react"; import { TooltipProvider } from "@radix-ui/react-tooltip"; import ProfileLanguageChart from "components/molecules/ProfileLanguageChart/profile-language-chart"; const storyConfig = { - title: "Design System/Molecules/Profile language chart" + title: "Design System/Molecules/Profile language chart", }; export default storyConfig; @@ -12,18 +12,18 @@ export default storyConfig; export const testLanguageList = [ { languageName: "TypeScript", - percentageUsed: 50 + percentageUsed: 50, }, { languageName: "JavaScript", - percentageUsed: 20 + percentageUsed: 20, }, { languageName: "Rust", - percentageUsed: 30 + percentageUsed: 30, }, { languageName: "Go", percentageUsed: 15 }, - { languageName: "Golo", percentageUsed: 15 } + { languageName: "Golo", percentageUsed: 15 }, ]; //CardHorizontalBarChart Template @@ -39,15 +39,15 @@ OneLanguage.args = { languageList: [ { languageName: "JavaScript", - percentageUsed: 100 - } - ] + percentageUsed: 100, + }, + ], }; export const MultipleLanguages = ProfileLanguageChartTemplate.bind({}); MultipleLanguages.args = { - languageList: testLanguageList + languageList: testLanguageList, }; export const notSupportedLanguage = ProfileLanguageChartTemplate.bind({}); @@ -55,7 +55,7 @@ notSupportedLanguage.args = { languageList: [ { languageName: "qBasic", - percentageUsed: 100 - } - ] + percentageUsed: 100, + }, + ], }; diff --git a/stories/molecules/pull-request-overview.stories.tsx b/stories/molecules/pull-request-overview.stories.tsx index 0e3c220416..7896ab5e55 100644 --- a/stories/molecules/pull-request-overview.stories.tsx +++ b/stories/molecules/pull-request-overview.stories.tsx @@ -3,14 +3,14 @@ import PullRequestOverview from "components/molecules/PullRequestOverview/pull-r const storyConfig = { title: "Design System/Molecules/Pull Request Overview", - component: "PullRequestOverview" + component: "PullRequestOverview", }; export default storyConfig; //PullRequestOverview Template const PullRequestOverviewTemplate: ComponentStory = (args) => ( -
+
); @@ -23,5 +23,5 @@ Default.args = { closed: 0, draft: 3, churn: 20, - churnDirection: "up" -}; \ No newline at end of file + churnDirection: "up", +}; diff --git a/stories/molecules/pull-request-social-card.stories.tsx b/stories/molecules/pull-request-social-card.stories.tsx index 7b0340e141..13bef8d079 100644 --- a/stories/molecules/pull-request-social-card.stories.tsx +++ b/stories/molecules/pull-request-social-card.stories.tsx @@ -4,7 +4,7 @@ import PullRequestSocialCard from "components/molecules/PullRequestSocialCard/pu import { testLanguageList } from "./card-horizontal-bar.stories"; const StoryConfig = { - title: "Design System/Molecules/PullRequestSocialCard" + title: "Design System/Molecules/PullRequestSocialCard", }; export default StoryConfig; @@ -27,5 +27,5 @@ PullRequestSocialCardStory.args = { prTicketId: "#223", commentsCount: 5, linesAdded: 12, - linesRemoved: 4 + linesRemoved: 4, }; diff --git a/stories/molecules/repo-card-profile.stories.tsx b/stories/molecules/repo-card-profile.stories.tsx index bda8cfbc62..638f48b328 100644 --- a/stories/molecules/repo-card-profile.stories.tsx +++ b/stories/molecules/repo-card-profile.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import RepoCardProfile from "components/molecules/RepoCardProfile/repo-card-profile"; const storyConfig = { - title: "Design System/Molecules/RepoCardProfile" + title: "Design System/Molecules/RepoCardProfile", }; export default storyConfig; @@ -16,5 +16,5 @@ Default.args = { orgName: "statelyai", repoName: "xstate", prCount: 56, - issueCount: 256 + issueCount: 256, }; diff --git a/stories/molecules/reports-history.stories.tsx b/stories/molecules/reports-history.stories.tsx index d7990d202e..ca8cbe0ba1 100644 --- a/stories/molecules/reports-history.stories.tsx +++ b/stories/molecules/reports-history.stories.tsx @@ -4,7 +4,7 @@ import { Report } from "interfaces/report-type"; const storyConfig = { title: "Design System/Molecules/Reports History", - component: "ReportsHistory" + component: "ReportsHistory", }; export default storyConfig; @@ -13,13 +13,13 @@ const testReportList: Report[] = [ { reportName: "Top Ten", reportDate: "Jun 3, 2022", - reportFormat: "CSV" + reportFormat: "CSV", }, { reportName: "Top Five", reportDate: "Jun 3, 2022", - reportFormat: "CSV" - } + reportFormat: "CSV", + }, ]; //ReportsHistory Template @@ -29,5 +29,5 @@ export const Default = ReportsHistoryTemplate.bind({}); export const NoReports = ReportsHistoryTemplate.bind({}); Default.args = { - reportList: testReportList -}; \ No newline at end of file + reportList: testReportList, +}; diff --git a/stories/molecules/repositories-table.stories.tsx b/stories/molecules/repositories-table.stories.tsx index 071ec4b317..081d124bfa 100644 --- a/stories/molecules/repositories-table.stories.tsx +++ b/stories/molecules/repositories-table.stories.tsx @@ -3,7 +3,7 @@ import RepositoriesTable from "../../components/organisms/RepositoriesTable/repo const storyConfig = { title: "Design System/Molecules/Repositories Table", - component: "RepositoriesTable" + component: "RepositoriesTable", }; export default storyConfig; @@ -25,111 +25,111 @@ const previewRepositories = [ closed: 3, draft: 8, churn: 40, - churnDirection: "up" + churnDirection: "up", }, prVelocity: { amount: "2 mo", churn: "30%", - churnDirection: "up" + churnDirection: "up", }, spam: { amount: "3 PRs", churn: "10%", - churnDirection: "up" + churnDirection: "up", }, contributors: [ { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" - } + alt: "E", + }, ], last30days: [ { - "id": "japan", - "color": "hsl(63, 70%, 50%)", - "data": [ + id: "japan", + color: "hsl(63, 70%, 50%)", + data: [ { - "x": "plane", - "y": 287 + x: "plane", + y: 287, }, { - "x": "helicopter", - "y": 183 + x: "helicopter", + y: 183, }, { - "x": "boat", - "y": 112 + x: "boat", + y: 112, }, { - "x": "train", - "y": 78 + x: "train", + y: 78, }, { - "x": "subway", - "y": 47 + x: "subway", + y: 47, }, { - "x": "bus", - "y": 218 + x: "bus", + y: 218, }, { - "x": "car", - "y": 106 + x: "car", + y: 106, }, { - "x": "moto", - "y": 190 + x: "moto", + y: 190, }, { - "x": "bicycle", - "y": 88 + x: "bicycle", + y: 88, }, { - "x": "horse", - "y": 8 + x: "horse", + y: 8, }, { - "x": "skateboard", - "y": 248 + x: "skateboard", + y: 248, }, { - "x": "others", - "y": 76 + x: "others", + y: 76, }, { - "x": "adwawd", - "y": 76 + x: "adwawd", + y: 76, }, { - "x": "awdawdd", - "y": 38 + x: "awdawdd", + y: 38, }, { - "x": "awd", - "y": 42 + x: "awd", + y: 42, }, { - "x": "adwadadw", - "y": 26 + x: "adwadadw", + y: 26, }, { - "x": "dadawda", - "y": 76 - } - ] - } - ] + x: "dadawda", + y: 76, + }, + ], + }, + ], }, { id: "2", @@ -141,111 +141,111 @@ const previewRepositories = [ closed: 0, draft: 1, churn: 100, - churnDirection: "down" + churnDirection: "down", }, prVelocity: { amount: "2 mo", churn: "30%", - churnDirection: "up" + churnDirection: "up", }, spam: { amount: "3 PRs", churn: "10%", - churnDirection: "up" + churnDirection: "up", }, contributors: [ { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" - } + alt: "E", + }, ], last30days: [ { - "id": "japan", - "color": "hsl(63, 70%, 50%)", - "data": [ + id: "japan", + color: "hsl(63, 70%, 50%)", + data: [ { - "x": "plane", - "y": 287 + x: "plane", + y: 287, }, { - "x": "helicopter", - "y": 183 + x: "helicopter", + y: 183, }, { - "x": "boat", - "y": 112 + x: "boat", + y: 112, }, { - "x": "train", - "y": 78 + x: "train", + y: 78, }, { - "x": "subway", - "y": 47 + x: "subway", + y: 47, }, { - "x": "bus", - "y": 218 + x: "bus", + y: 218, }, { - "x": "car", - "y": 106 + x: "car", + y: 106, }, { - "x": "moto", - "y": 190 + x: "moto", + y: 190, }, { - "x": "bicycle", - "y": 88 + x: "bicycle", + y: 88, }, { - "x": "horse", - "y": 8 + x: "horse", + y: 8, }, { - "x": "skateboard", - "y": 248 + x: "skateboard", + y: 248, }, { - "x": "others", - "y": 76 + x: "others", + y: 76, }, { - "x": "adwawd", - "y": 76 + x: "adwawd", + y: 76, }, { - "x": "awdawdd", - "y": 38 + x: "awdawdd", + y: 38, }, { - "x": "awd", - "y": 42 + x: "awd", + y: 42, }, { - "x": "adwadadw", - "y": 26 + x: "adwadadw", + y: 26, }, { - "x": "dadawda", - "y": 76 - } - ] - } - ] + x: "dadawda", + y: 76, + }, + ], + }, + ], }, { id: "3", @@ -257,114 +257,114 @@ const previewRepositories = [ closed: 4, draft: 0, churn: 20, - churnDirection: "up" + churnDirection: "up", }, prVelocity: { amount: "2 mo", churn: "30%", - churnDirection: "up" + churnDirection: "up", }, spam: { amount: "3 PRs", churn: "10%", - churnDirection: "up" + churnDirection: "up", }, contributors: [ { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" + alt: "E", }, { avatarURL: "", initials: "ES", - alt: "E" - } + alt: "E", + }, ], last30days: [ { - "id": "japan", - "color": "hsl(63, 70%, 50%)", - "data": [ + id: "japan", + color: "hsl(63, 70%, 50%)", + data: [ { - "x": "plane", - "y": 287 + x: "plane", + y: 287, }, { - "x": "helicopter", - "y": 183 + x: "helicopter", + y: 183, }, { - "x": "boat", - "y": 112 + x: "boat", + y: 112, }, { - "x": "train", - "y": 78 + x: "train", + y: 78, }, { - "x": "subway", - "y": 47 + x: "subway", + y: 47, }, { - "x": "bus", - "y": 218 + x: "bus", + y: 218, }, { - "x": "car", - "y": 106 + x: "car", + y: 106, }, { - "x": "moto", - "y": 190 + x: "moto", + y: 190, }, { - "x": "bicycle", - "y": 88 + x: "bicycle", + y: 88, }, { - "x": "horse", - "y": 8 + x: "horse", + y: 8, }, { - "x": "skateboard", - "y": 248 + x: "skateboard", + y: 248, }, { - "x": "others", - "y": 76 + x: "others", + y: 76, }, { - "x": "adwawd", - "y": 76 + x: "adwawd", + y: 76, }, { - "x": "awdawdd", - "y": 38 + x: "awdawdd", + y: 38, }, { - "x": "awd", - "y": 42 + x: "awd", + y: 42, }, { - "x": "adwadadw", - "y": 26 + x: "adwadadw", + y: 26, }, { - "x": "dadawda", - "y": 76 - } - ] - } - ] - } + x: "dadawda", + y: 76, + }, + ], + }, + ], + }, ]; Default.args = { - listOfRepositories: previewRepositories + listOfRepositories: previewRepositories, }; diff --git a/stories/molecules/repository-cart-item.stories.tsx b/stories/molecules/repository-cart-item.stories.tsx index 97cd450817..3dbb4dc5e7 100644 --- a/stories/molecules/repository-cart-item.stories.tsx +++ b/stories/molecules/repository-cart-item.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import RepositoryCartItem from "components/molecules/ReposoitoryCartItem/repository-cart-item"; const storyConfig = { - title: "Design System/Molecules/RepositoriesCartItem" + title: "Design System/Molecules/RepositoriesCartItem", }; export default storyConfig; @@ -15,5 +15,5 @@ export const Default = RepositoryCartItemTemplate.bind({}); Default.args = { orgName: "open sauced", repoName: "hot", - totalPrs: 32 + totalPrs: 32, }; diff --git a/stories/molecules/repository-result.stories.tsx b/stories/molecules/repository-result.stories.tsx index 9264aa0010..862155d79d 100644 --- a/stories/molecules/repository-result.stories.tsx +++ b/stories/molecules/repository-result.stories.tsx @@ -1,7 +1,7 @@ import RepositoryResult from "components/molecules/RepositoryResult/repository-result"; const storyConfig = { - title: "Design System/Molecules/RepositoryResult" + title: "Design System/Molecules/RepositoryResult", }; export default storyConfig; export const RepositoryResultStory = () => ; diff --git a/stories/molecules/search-result.stories.tsx b/stories/molecules/search-result.stories.tsx index 3814ca361a..f07bb80bbd 100644 --- a/stories/molecules/search-result.stories.tsx +++ b/stories/molecules/search-result.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import SearchResults from "components/molecules/SearchResults/search-results"; import RepositoryResult from "components/molecules/RepositoryResult/repository-result"; const StoryConfig = { - title: "Design System/Molecules/SearchResults" + title: "Design System/Molecules/SearchResults", }; export default StoryConfig; @@ -17,5 +17,5 @@ const SearchResultsTemplates: ComponentStory = (args) => ( export const Default = SearchResultsTemplates.bind({}); Default.args = { - state: "open" + state: "open", }; diff --git a/stories/molecules/stacked-avatar.stories.tsx b/stories/molecules/stacked-avatar.stories.tsx index 07feb12cef..22a340547e 100644 --- a/stories/molecules/stacked-avatar.stories.tsx +++ b/stories/molecules/stacked-avatar.stories.tsx @@ -4,7 +4,7 @@ import StackedAvatar from "components/molecules/StackedAvatar/stacked-avatar"; import { mockDbContributions } from "../mockedData"; const storyConfig = { - title: "Design System/Molecules/Stacked Avatar" + title: "Design System/Molecules/Stacked Avatar", }; export default storyConfig; @@ -16,5 +16,5 @@ const template: ComponentStory = (args) => ( export const Default = template.bind({}); Default.args = { - contributors: mockDbContributions + contributors: mockDbContributions, }; diff --git a/stories/molecules/suggested-repository.stories.tsx b/stories/molecules/suggested-repository.stories.tsx index 4978b912ce..f530f424e0 100644 --- a/stories/molecules/suggested-repository.stories.tsx +++ b/stories/molecules/suggested-repository.stories.tsx @@ -2,7 +2,7 @@ import { ComponentStory } from "@storybook/react"; import SuggestedRepository from "components/molecules/SuggestedRepo/suggested-repo"; const storyConfig = { - title: "Design System/Molecules/SuggestedRepo" + title: "Design System/Molecules/SuggestedRepo", }; export default storyConfig; @@ -18,6 +18,6 @@ SuggestedRepoStory.args = { orgName: "statelyai", repoName: "xstate", prCount: 56, - issueCount: 256 - } + issueCount: 256, + }, }; diff --git a/stories/molecules/superlative-selector.stories.tsx b/stories/molecules/superlative-selector.stories.tsx index 7997757623..b1540683c1 100644 --- a/stories/molecules/superlative-selector.stories.tsx +++ b/stories/molecules/superlative-selector.stories.tsx @@ -3,7 +3,7 @@ import SuperativeSelector from "components/molecules/SuperlativeSelector/superla const storyConfig = { title: "Design System/Molecules/SuperativeSelector", - component: "SuperativeSelector" + component: "SuperativeSelector", }; export default storyConfig; @@ -17,9 +17,9 @@ const SuperlativeSelectorTemplate: ComponentStory = ( export const Default = SuperlativeSelectorTemplate.bind({}); export const Selected = SuperlativeSelectorTemplate.bind({}); Default.args = { - filterOptions: testOptions + filterOptions: testOptions, }; Selected.args = { filterOptions: testOptions, - selected: "testOption2" + selected: "testOption2", }; diff --git a/stories/molecules/table-repository-name.stories.tsx b/stories/molecules/table-repository-name.stories.tsx index 3fc1ba4222..8b8079d633 100644 --- a/stories/molecules/table-repository-name.stories.tsx +++ b/stories/molecules/table-repository-name.stories.tsx @@ -3,16 +3,18 @@ import TableRepositoryName from "components/molecules/TableRepositoryName/table- const storyConfig = { title: "Design System/Molecules/Table Repository Name", - component: "TableRepositoryName" + component: "TableRepositoryName", }; export default storyConfig; //TableRepositoryName Template -const TableRepositoryNameTemplate: ComponentStory = (args) => ; +const TableRepositoryNameTemplate: ComponentStory = (args) => ( + +); export const Default = TableRepositoryNameTemplate.bind({}); Default.args = { - fullName: "open-sauced/insights" -}; \ No newline at end of file + fullName: "open-sauced/insights", +}; diff --git a/stories/molecules/top-nav-logo.stories.tsx b/stories/molecules/top-nav-logo.stories.tsx index 6381ed6ecb..17d6238d7c 100644 --- a/stories/molecules/top-nav-logo.stories.tsx +++ b/stories/molecules/top-nav-logo.stories.tsx @@ -1,7 +1,7 @@ import HeaderLogo from "../../components/molecules/HeaderLogo/header-logo"; const storyConfig = { - title: "Design System/Molecules/Top Nav Logo" + title: "Design System/Molecules/Top Nav Logo", }; export default storyConfig; diff --git a/stories/molecules/wailtlist-button.stories.tsx b/stories/molecules/wailtlist-button.stories.tsx index 270103989d..a92e237bb9 100644 --- a/stories/molecules/wailtlist-button.stories.tsx +++ b/stories/molecules/wailtlist-button.stories.tsx @@ -2,12 +2,11 @@ import { ComponentStory } from "@storybook/react"; import WaitlistButton from "../../components/molecules/WaitlistButton/waitlist-button"; const StoryConfig = { - title: "Design System/Molecules/Waitlist Button" + title: "Design System/Molecules/Waitlist Button", }; export default StoryConfig; - const WaitlistButtonTemplate: ComponentStory = (args) => ; export const Default = WaitlistButtonTemplate.bind({}); @@ -15,14 +14,14 @@ export const Submitting = WaitlistButtonTemplate.bind({}); export const Waitlisted = WaitlistButtonTemplate.bind({}); Default.args = { - waitlisted: false + waitlisted: false, }; Submitting.args = { waitlisted: false, - submitting: true + submitting: true, }; Waitlisted.args = { - waitlisted: true + waitlisted: true, }; diff --git a/stories/organisms/component-waitlist.stories.tsx b/stories/organisms/component-waitlist.stories.tsx index 9e1eeecbd2..185ac2d51c 100644 --- a/stories/organisms/component-waitlist.stories.tsx +++ b/stories/organisms/component-waitlist.stories.tsx @@ -1,7 +1,7 @@ import WaitlistComponent from "components/organisms/Waitlist/waitlist"; const StoryConfig = { - title: "Design System/Organisms/WaitlistComponent" + title: "Design System/Organisms/WaitlistComponent", }; export default StoryConfig; diff --git a/stories/organisms/contributor-card.stories.tsx b/stories/organisms/contributor-card.stories.tsx index 2f369922b0..eca76af3af 100644 --- a/stories/organisms/contributor-card.stories.tsx +++ b/stories/organisms/contributor-card.stories.tsx @@ -4,17 +4,17 @@ import TestRepoAvatar from "img/icons/test-repo-avatar.svg"; const storyConfig = { title: "Design System/Organisms/Contributor Card", - component: "ContributorCard" + component: "ContributorCard", }; export default storyConfig; -const lineChart = { +const lineChart = { xAxis: { type: "category", boundaryGap: false, axisLabel: false, - data: ["Jan 1, 2022", "Jan 15, 2022", "Feb 1, 2022"] + data: ["Jan 1, 2022", "Jan 15, 2022", "Feb 1, 2022"], }, yAxis: { type: "value", @@ -22,16 +22,16 @@ const lineChart = { axisLabel: false, splitLine: { lineStyle: { - type: "dashed" - } - } + type: "dashed", + }, + }, }, grid: { height: 100, top: 0, bottom: 0, right: 0, - left: 0 + left: 0, }, series: [ { @@ -40,63 +40,64 @@ const lineChart = { smooth: true, showSymbol: false, lineStyle: { - color: "#ff9800" + color: "#ff9800", }, areaStyle: { color: "#FFB74D", - opacity: 0.6 - } - } - ] + opacity: 0.6, + }, + }, + ], }; const profile = { - githubAvatar: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", + githubAvatar: + "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1064&q=80", githubName: "ChadStewart", totalPRs: 4, - dateOfFirstPR: "3mo" + dateOfFirstPR: "3mo", }; const repoList = [ { repoName: "test", - repoIcon: TestRepoAvatar + repoIcon: TestRepoAvatar, }, { repoName: "test2", - repoIcon: TestRepoAvatar + repoIcon: TestRepoAvatar, }, { repoName: "test3", - repoIcon: TestRepoAvatar + repoIcon: TestRepoAvatar, }, { repoName: "test4", - repoIcon: TestRepoAvatar + repoIcon: TestRepoAvatar, }, { repoName: "test5", - repoIcon: TestRepoAvatar + repoIcon: TestRepoAvatar, }, { repoName: "test6", - repoIcon: TestRepoAvatar - } + repoIcon: TestRepoAvatar, + }, ]; const languageList = [ { languageName: "TypeScript", - percentageUsed: 50 + percentageUsed: 50, }, { languageName: "JavaScript", - percentageUsed: 20 + percentageUsed: 20, }, { languageName: "Rust", - percentageUsed: 30 - } + percentageUsed: 30, + }, ]; const listOfPRs = [ @@ -106,7 +107,7 @@ const listOfPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -114,7 +115,7 @@ const listOfPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -122,7 +123,7 @@ const listOfPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 + noOfLinesChanged: 837, }, { prName: "Merging some work", @@ -130,17 +131,17 @@ const listOfPRs = [ prIssuedTime: "2mo", prClosedTime: "2mo", noOfFilesChanged: 13, - noOfLinesChanged: 837 - } + noOfLinesChanged: 837, + }, ]; //ContributorCard Template -const ContributorCardTemplate: ComponentStory = (args) => ; +const ContributorCardTemplate: ComponentStory = (args) => ; export const Default = ContributorCardTemplate.bind({}); Default.args = { contributor: { - profile: profile - } + profile: profile, + }, }; diff --git a/stories/organisms/contributor-profile-page.stories.tsx b/stories/organisms/contributor-profile-page.stories.tsx index 7843f94806..6f46bafd14 100644 --- a/stories/organisms/contributor-profile-page.stories.tsx +++ b/stories/organisms/contributor-profile-page.stories.tsx @@ -3,7 +3,7 @@ import { TooltipProvider } from "@radix-ui/react-tooltip"; import ContributorProfilePage from "components/organisms/ContributorProfilePage/contributor-profile-page"; const storyConfig = { - title: "Design System/Organisms/Contributor Profile Page" + title: "Design System/Organisms/Contributor Profile Page", }; export default storyConfig; const listOfPRs = [ @@ -16,7 +16,7 @@ const listOfPRs = [ noOfLinesChanged: 837, repoName: "open-sauced", repoOwner: "open-sauced", - prNumber: 1 + prNumber: 1, }, { prName: "Merging some work", @@ -27,7 +27,7 @@ const listOfPRs = [ noOfLinesChanged: 837, repoName: "open-sauced", repoOwner: "open-sauced", - prNumber: 2 + prNumber: 2, }, { prName: "Merging some work", @@ -38,7 +38,7 @@ const listOfPRs = [ noOfLinesChanged: 837, repoName: "open-sauced", repoOwner: "open-sauced", - prNumber: 3 + prNumber: 3, }, { prName: "Merging some work", @@ -49,8 +49,8 @@ const listOfPRs = [ noOfLinesChanged: 837, repoName: "open-sauced", repoOwner: "open-sauced", - prNumber: 4 - } + prNumber: 4, + }, ]; const ContributorProfilePageTemplate: ComponentStory = (args) => ( @@ -62,5 +62,5 @@ const ContributorProfilePageTemplate: ComponentStory ; export const ContributorsStory = ContributorsTemplate.bind({}); - diff --git a/stories/organisms/dashboard.stories.tsx b/stories/organisms/dashboard.stories.tsx index 349e02c406..84150476a2 100644 --- a/stories/organisms/dashboard.stories.tsx +++ b/stories/organisms/dashboard.stories.tsx @@ -1,8 +1,7 @@ import Dashboard from "components/organisms/Dashboard/dashboard"; - const StoryConfig = { - title: "Design System/organisms/Dashboard" + title: "Design System/organisms/Dashboard", }; export default StoryConfig; diff --git a/stories/organisms/footer.stories.tsx b/stories/organisms/footer.stories.tsx index b469f9a4dd..c1e26c8fc4 100644 --- a/stories/organisms/footer.stories.tsx +++ b/stories/organisms/footer.stories.tsx @@ -1,9 +1,9 @@ import Footer from "../../components/organisms/Footer/footer"; const storyConfig = { - title: "Design System/Organisms/Footer" + title: "Design System/Organisms/Footer", }; export default storyConfig; -export const FooterOrganism = () =>