Skip to content
This repository has been archived by the owner on Dec 13, 2022. It is now read-only.

Commit

Permalink
⚡ #76 Implements next app conf for deployment on arweave
Browse files Browse the repository at this point in the history
  • Loading branch information
@rekpero
rekpero committed Jan 8, 2021
1 parent 8ffa29e commit 3242b10
Show file tree
Hide file tree
Showing 3 changed files with 101 additions and 64 deletions.
66 changes: 42 additions & 24 deletions src/components/DeploySiteConfig/DeploySiteConfig.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,10 @@ function DeploySiteConfig() {
setPackageManager("npm");
setBuildCommand("build");
setPublishDirectory("dist/your-app-name");
} else if (framework === "next") {
setPackageManager("yarn");
setBuildCommand("next build && next export");
setPublishDirectory("out");
}
}, [framework]);

Expand Down Expand Up @@ -588,6 +592,7 @@ function DeploySiteConfig() {
<option value="react">Create React App</option>
<option value="vue">Vue App</option>
<option value="angular">Angular App</option>
<option value="next">Next.js App</option>
</select>
<span className="select-down-icon">
<FontAwesomeIcon icon={faChevronDown} />
Expand All @@ -596,38 +601,51 @@ function DeploySiteConfig() {
</div>
{framework !== "static" && (
<>
<div className="deploy-site-item-form-item">
<label>Package Manager</label>
<div className="deploy-site-item-select-container">
<select
className="deploy-site-item-select"
value={packageManager}
onChange={(e) => setPackageManager(e.target.value)}
>
<option value="npm">NPM</option>
<option value="yarn">YARN</option>
</select>
<span className="select-down-icon">
<FontAwesomeIcon icon={faChevronDown} />
</span>
{framework !== "next" ? (
<div className="deploy-site-item-form-item">
<label>Package Manager</label>
<div className="deploy-site-item-select-container">
<select
className="deploy-site-item-select"
value={packageManager}
onChange={(e) =>
setPackageManager(e.target.value)
}
>
<option value="npm">NPM</option>
<option value="yarn">YARN</option>
</select>
<span className="select-down-icon">
<FontAwesomeIcon icon={faChevronDown} />
</span>
</div>
</div>
</div>
) : null}
<div className="deploy-site-item-form-item">
<label>Build command</label>
<div className="deploy-site-item-input-container">
<input
type="text"
className="deploy-site-item-input-disabled"
value={buildCommandPrefix}
disabled
/>
{framework !== "next" ? (
<div className="deploy-site-item-input-container">
<input
type="text"
className="deploy-site-item-input-disabled"
value={buildCommandPrefix}
disabled
/>
<input
type="text"
className="deploy-site-item-input-build"
value={buildCommand}
onChange={(e) => setBuildCommand(e.target.value)}
/>
</div>
) : (
<input
type="text"
className="deploy-site-item-input-build"
className="deploy-site-item-input"
value={buildCommand}
onChange={(e) => setBuildCommand(e.target.value)}
/>
</div>
)}
</div>
<div className="deploy-site-item-form-item">
<label>Publish directory</label>
Expand Down
4 changes: 3 additions & 1 deletion src/components/Sites/routes/Deployment/Deployment.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,9 @@ const Deployment = () => {
}
});
// CLEAN UP THE EFFECT
} else {
} else if (
result.deployment.deploymentStatus.toLowerCase() === "deployed"
) {
setDeployedLink(result.deployment.sitePreview);
setIsDeployed(true);
const buildMins = Number.parseInt(
Expand Down
95 changes: 56 additions & 39 deletions src/components/Sites/routes/Settings/routes/SettingsBuildDeploy/SettingsBuildDeploy.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,8 +96,12 @@ const SettingsBuildDeploy = () => {
framework = "Create React App";
} else if (selectedProject?.framework === "vue") {
framework = "Vue App";
} else if (selectedProject?.framework === "angular") {
framework = "Angular App";
} else if (selectedProject?.framework === "next") {
framework = "Next.js App";
} else {
framework = "Create React App";
framework = "N.A";
}

return (
Expand Down Expand Up @@ -130,32 +134,34 @@ const SettingsBuildDeploy = () => {
</div>
{selectedProject?.framework !== "static" && (
<>
<div className="settings-project-item">
<label className="settings-project-item-title">
Package Manager
</label>
<label className="settings-project-item-subtitle">
This is your project's package manager. You can use any one of
them to deploy your project.
</label>
{!projectLoading ? (
<div className="deploy-site-item-select-container">
<select
className="deploy-site-item-select"
value={packageManager}
onChange={(e) => setPackageManager(e.target.value)}
>
<option value="npm">NPM</option>
<option value="yarn">YARN</option>
</select>
<span className="select-down-icon">
<FontAwesomeIcon icon={faChevronDown} />
</span>
</div>
) : (
<Skeleton width={326} height={36} duration={2} />
)}
</div>
{selectedProject?.framework !== "next" ? (
<div className="settings-project-item">
<label className="settings-project-item-title">
Package Manager
</label>
<label className="settings-project-item-subtitle">
This is your project's package manager. You can use any one of
them to deploy your project.
</label>
{!projectLoading ? (
<div className="deploy-site-item-select-container">
<select
className="deploy-site-item-select"
value={packageManager}
onChange={(e) => setPackageManager(e.target.value)}
>
<option value="npm">NPM</option>
<option value="yarn">YARN</option>
</select>
<span className="select-down-icon">
<FontAwesomeIcon icon={faChevronDown} />
</span>
</div>
) : (
<Skeleton width={326} height={36} duration={2} />
)}
</div>
) : null}
<div className="settings-project-item">
<label className="settings-project-item-title">
Build Command
Expand All @@ -165,18 +171,29 @@ const SettingsBuildDeploy = () => {
</label>
{!projectLoading ? (
<div className="settings-project-item-input-container">
<input
type="text"
className="settings-project-item-input-disabled"
value={buildCommandPrefix}
disabled
/>
<input
type="text"
className="settings-project-item-input-build"
value={buildCommand}
onChange={(e) => setBuildCommand(e.target.value)}
/>
{selectedProject?.framework !== "next" ? (
<>
<input
type="text"
className="settings-project-item-input-disabled"
value={buildCommandPrefix}
disabled
/>
<input
type="text"
className="settings-project-item-input-build"
value={buildCommand}
onChange={(e) => setBuildCommand(e.target.value)}
/>
</>
) : (
<input
type="text"
className="settings-project-item-input"
value={buildCommand}
onChange={(e) => setBuildCommand(e.target.value)}
/>
)}
</div>
) : (
<Skeleton width={326} height={36} duration={2} />
Expand Down

0 comments on commit 3242b10

Please sign in to comment.