Skip to content

Commit

Permalink
Delete Button Added
Browse files Browse the repository at this point in the history
  • Loading branch information
@danielcranney
danielcranney committed Mar 10, 2022
1 parent bbd1630 commit 92065c9
Show file tree
Hide file tree
Showing 4 changed files with 135 additions and 47 deletions.
37 changes: 37 additions & 0 deletions components/buttons/DeleteRepo.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React, { useContext } from "react";
import { StateContext } from "../../pages/_app";

const DeleteRepo = ({ action, type }) => {
const { dispatch } = useContext(StateContext);
return (
<button
className="btn-sm border border-dark-500 w-9.5 justify-center text-dark-300 hover:text-white group"
onClick={() =>
dispatch({
type: action,
payload: {
title: type,
value: null,
},
})
}
>
<svg
className="w-6 h-6 group-hover:scale-110"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M6 18L18 6M6 6l12 12"
></path>
</svg>
</button>
);
};

export default DeleteRepo;
12 changes: 12 additions & 0 deletions pages/_app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export const ACTIONS = {
STYLE_BADGES: "style-badges",
TOGGLE_STYLE_COLOR: "toggle-style-color",
ADD_REPO: "add-repo",
DELETE_REPO: "delete-repo",
ADD_SUPPORT: "add-support",
};

Expand Down Expand Up @@ -821,6 +822,17 @@ function reducer(state, action) {
},
},
};
case ACTIONS.DELETE_REPO:
return {
...state,
badges: {
...state.badges,
reposCard: {
...state.badges.reposCard,
[action.payload.title]: action.payload.value,
},
},
};
// Support Actions
case ACTIONS.ADD_SUPPORT:
return {
Expand Down
131 changes: 85 additions & 46 deletions pages/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import IntroductionTextarea from "../components/IntroductionTextarea";
import NextSection from "../components/buttons/NextSection";
import PreviousSection from "../components/buttons/PreviousSection";
import CopyrightLabel from "../components/misc/CopyrightLabel";
import DeleteRepo from "../components/buttons/DeleteRepo";
let TurndownService = require("turndown").default;

export default function Home() {
Expand Down Expand Up @@ -1034,33 +1035,51 @@ export default function Home() {
/>

{state.badges.reposCard.repoTwo != null ? (
<FormInput
ref={repoTwoRef}
section={"reposCard"}
type={"repoTwo"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<article className="flex gap-x-2 h-9.5">
<FormInput
ref={repoTwoRef}
section={"reposCard"}
type={"repoTwo"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<DeleteRepo
action={ACTIONS.DELETE_REPO}
type={"repoTwo"}
/>
</article>
) : null}

{state.badges.reposCard.repoThree != null ? (
<FormInput
ref={repoThreeRef}
section={"reposCard"}
type={"repoThree"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<article className="flex gap-x-2 h-9.5">
<FormInput
ref={repoThreeRef}
section={"reposCard"}
type={"repoThree"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<DeleteRepo
action={ACTIONS.DELETE_REPO}
type={"repoThree"}
/>
</article>
) : null}

{state.badges.reposCard.repoFour != null ? (
<FormInput
ref={repoFourRef}
section={"reposCard"}
type={"repoFour"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<article className="flex gap-x-2 h-9.5">
<FormInput
ref={repoFourRef}
section={"reposCard"}
type={"repoFour"}
placeholder={"repo-name"}
action={ACTIONS.ADD_REPO}
/>
<DeleteRepo
action={ACTIONS.DELETE_REPO}
type={"repoFour"}
/>
</article>
) : null}
</article>
{state.badges.reposCard.repoTwo != null ? null : (
Expand Down Expand Up @@ -1617,40 +1636,54 @@ export default function Home() {
) : null}

{state.badges.githubStatsCard.selected ? (
<img
src={`https://github-readme-stats.vercel.app/api?username=${
state.socials.github.linkSuffix
}&hide=${state.badges.githubStatsCard.stars ? "" : "stars,"}${
state.badges.githubStatsCard.commits ? "" : "commits,"
}${state.badges.githubStatsCard.prs ? "" : "prs,"}${
state.badges.githubStatsCard.issues ? "" : "issues,"
}${state.badges.githubStatsCard.contribs ? "" : "contribs"}${
state.badges.githubStatsCard.privateCommits
? "&count_private=true"
: ""
}&title_color=${
state.badges.cardStyle.titleColor
}&text_color=${state.badges.cardStyle.textColor}&icon_color=${
state.badges.cardStyle.iconColor
}&bg_color=${
state.badges.cardStyle.bgColor
}&hide_border=true&border_radius=0&show_icons=true`}
className="object-scale-down"
/>
<a
href={`http://www.github.com/${state.socials.github.linkSuffix}`}
target="_blank"
rel="noreferrer"
>
<img
src={`https://github-readme-stats.vercel.app/api?username=${
state.socials.github.linkSuffix
}&hide=${
state.badges.githubStatsCard.stars ? "" : "stars,"
}${state.badges.githubStatsCard.commits ? "" : "commits,"}${
state.badges.githubStatsCard.prs ? "" : "prs,"
}${state.badges.githubStatsCard.issues ? "" : "issues,"}${
state.badges.githubStatsCard.contribs ? "" : "contribs"
}${
state.badges.githubStatsCard.privateCommits
? "&count_private=true"
: ""
}&title_color=${
state.badges.cardStyle.titleColor
}&text_color=${
state.badges.cardStyle.textColor
}&icon_color=${state.badges.cardStyle.iconColor}&bg_color=${
state.badges.cardStyle.bgColor
}&hide_border=true&border_radius=0&show_icons=true`}
className="object-scale-down"
/>
</a>
) : null}

{state.badges.githubStreak.selected ? (
<>
<a
href={`http://www.github.com/${state.socials.github.linkSuffix}`}
target="_blank"
rel="noreferrer"
>
<img
src={`https://github-readme-streak-stats.herokuapp.com/?user=${state.socials.github.linkSuffix}&stroke=${state.badges.cardStyle.textColor}&background=${state.badges.cardStyle.bgColor}&ring=${state.badges.cardStyle.titleColor}&fire=${state.badges.cardStyle.titleColor}&currStreakNum=${state.badges.cardStyle.textColor}&currStreakLabel=${state.badges.cardStyle.titleColor}&sideNums=${state.badges.cardStyle.textColor}&sideLabels=${state.badges.cardStyle.textColor}&dates=${state.badges.cardStyle.textColor}&hide_border=true`}
className="object-scale-down"
/>
</>
</a>
) : null}

{state.badges.githubCommitsGraph.selected ? (
<a
href={`http://www.github.com/${state.socials.github.linkSuffix}`}
target="_blank"
rel="noreferrer"
>
<img
src={`https://activity-graph.herokuapp.com/graph?username=${state.socials.github.linkSuffix}&bg_color=${state.badges.cardStyle.bgColor}&color=${state.badges.cardStyle.textColor}&line=${state.badges.cardStyle.iconColor}&point=${state.badges.cardStyle.textColor}&area_color=${state.badges.cardStyle.bgColor}&area=true&hide_border=true&custom_title=GitHub%20Commits%20Graph`}
Expand All @@ -1659,9 +1692,15 @@ export default function Home() {
) : null}

{state.badges.topLangsCard.selected ? (
<img
src={`https://github-readme-stats.vercel.app/api/top-langs/?username=danielcranney&langs_count=10&title_color=${state.badges.cardStyle.titleColor}&text_color=${state.badges.cardStyle.textColor}&icon_color=${state.badges.cardStyle.iconColor}&bg_color=${state.badges.cardStyle.bgColor}&hide_border=true&locale=en&custom_title=Top%20%Languages`}
/>
<a
href={`http://www.github.com/${state.socials.github.linkSuffix}`}
target="_blank"
rel="noreferrer"
>
<img
src={`https://github-readme-stats.vercel.app/api/top-langs/?username=danielcranney&langs_count=10&title_color=${state.badges.cardStyle.titleColor}&text_color=${state.badges.cardStyle.textColor}&icon_color=${state.badges.cardStyle.iconColor}&bg_color=${state.badges.cardStyle.bgColor}&hide_border=true&locale=en&custom_title=Top%20%Languages`}
/>
</a>
) : null}

{/* Repo Cards */}
Expand Down
2 changes: 1 addition & 1 deletion tailwind.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ module.exports = {
theme: {
extend: {
spacing: {
14: "3.5rem",
9.5: "2.375rem",
18: "4.5rem",
19: "4.75rem",
22: "5.5rem",
Expand Down

1 comment on commit 92065c9

@vercel
Copy link

@vercel vercel bot commented on 92065c9 Mar 10, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

Please sign in to comment.