Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Convert plugins.jenkins.io to a static compiled html site #76

Merged
merged 117 commits into from
Jan 10, 2020

Conversation

halkeye
Copy link
Member

@halkeye halkeye commented Dec 14, 2019

Changes

  • Switched from really old nextjs to gatsby
  • Upgraded React
  • Removed redux (gatsby data layer takes care of the majority, and searching is just an api call)
  • Cleaned up some of the CSS and switched to more bootstrap friendly containers, so its more mobile friendly

Outstanding issues

  • Remove Fake dialog box
  • upgrade everything to node 13
  • Figure out deployment (For now I'm going to split the codebase into 2 repos. 1) plugin-site-api docker image (blocked by https://issues.jenkins-ci.org/browse/INFRA-2400) 2) Update helm chart to deploy both docker images independantly using the same ingress)
  • Revert jenkinsfile to something that runs in ci.jenkins
  • > The icon view / detail view / list view switch on the search page doesn't work and is rendered strangely
  • change urls to plugins.jenkins.io / make overrideable by env variables
  • The category links don’t work on the home page
  • Browse/search results page is missing title
  • Still says Jenkins Plugins | Jenkins Plugins in various places
  • Adding new

Delaying till later

  • Going to page 2 of search results, then searching for more specific (adding labels/categorys/or query string) will show no results cause on page 2 not page 1
  • More mobile fixes
  • Completely remove the main.module.css?
  • Remove runtime dependancy on api?

Demo / See it in glorious action:

https://jenkins-plugins.g4v.dev/

@halkeye halkeye requested a review from a team as a code owner December 14, 2019 03:25
@rtyler
Copy link
Member

rtyler commented Dec 14, 2019

@halkeye Interesting work, the site looks promising but what does this mean "staticly compile?" Does this remove the need for the API server behind the scenes?

@halkeye
Copy link
Member Author

halkeye commented Dec 14, 2019

It uses the API server for search, and the initial compiling.

The search could easily be switched away from API server.

I think lots of the API server functionality could get moved to update center.

@rtyler
Copy link
Member

rtyler commented Dec 14, 2019

@halkeye Yeah, I have long thought about just removing the API server from the equation and just grabbing the update center for the page to use at runtime.

The Update Center JSON is a little fat, but it would allow plugins.jenkins.io to be run off github pages entirely

@halkeye
Copy link
Member Author

halkeye commented Dec 14, 2019

The Update Center JSON is a little fat, but it would allow plugins.jenkins.io to be run off github pages entirely

It doesn't have to have the content inside the update center json, it could easily be seperate files

Then different things could start consuming more and more of it, like inside jenkins could show the readme as an iframe or something.

Yeah, I have long thought about just removing the API server from the equation and just grabbing the update center for the page to use at runtime.

I'm pretty sure it would only take me a couple hours at most to remove API from runtime for search, i did it because I thought "relevance" search was something special.

@olblak olblak self-requested a review January 2, 2020 10:59
Copy link
Member

@olblak olblak left a comment

Choose a reason for hiding this comment

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

:o 156 file changes
On overall it's already a major improvement, removing ci.jenkins.io dependency and being able to search for plugin information on my phone is already awesome. I am still evaluating Netlify instead of azure.
I still have to give another review on this PR

environment {
DISABLE_SEARCH_ENGINE = "true" // for the test site
GATSBY_CONFIG_SITE_METADATA__URL = "https://jenkins-plugins.g4v.dev/"
GATSBY_CONFIG_SITE_METADATA__SITE_URL = "https://jenkins-plugins.g4v.dev/"
Copy link
Member

Choose a reason for hiding this comment

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

I guess this url will have to be updated

Copy link
Member Author

Choose a reason for hiding this comment

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

This is only the "test" server (in comments). Its running on my jenkins instance, everywhere else will just do the regular build.

Jenkinsfile Outdated Show resolved Hide resolved
Dockerfile Outdated
CMD yarn server

EXPOSE 5000
# FROM nginx:1.17.6
Copy link
Member

Choose a reason for hiding this comment

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

is the intention to use nginx image? what's the reason for this comment being here?

Copy link
Member Author

Choose a reason for hiding this comment

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

left behind probably. the gatsby image is way faster than stock nginx, and i still think cdn > docker.

@timja
Copy link
Member

timja commented Jan 6, 2020

The homepage doesn't look great on my widescreen monitor:

Plugins index off center,
White bar between header and content
Logo position has changed not sure if thats an issue or not though

image

for comparison existing one:

image

@timja
Copy link
Member

timja commented Jan 6, 2020

Is the text too far to the left on desktop now?

image

image

@timja
Copy link
Member

timja commented Jan 6, 2020

The CSS seems to be missing for the pointer on the search page and the border highlight on hover is missing,

https://jenkins-plugins.g4v.dev/ui/search?query=azure

static site:
image

prod:
image

little hard to tell in the screenshot but their should be a "hand" pointer to indicate that the tile is clickable, and the border in the previous site was highlighted to further indicate which one would be clicked on I guess

@halkeye
Copy link
Member Author

halkeye commented Jan 7, 2020

Is the text too far to the left on desktop now?

thats not very actionable. Who should answer that? I can certainly give it more padding, but how much is good?

At some point maybe we should involve @josephbrueggen/ux sig

@halkeye
Copy link
Member Author

halkeye commented Jan 7, 2020

Okay, I think I've handled all the issues. Its getting super hard to keep track of change requests.

@jenkinsadmin
Copy link

Build failed; the context from the latest run is:

Expand to view
[2020-01-07T04:20:00.619Z] c9875e10f676: Verifying Checksum
[2020-01-07T04:20:00.619Z] c9875e10f676: Download complete
[2020-01-07T04:20:00.619Z] ccde658bec80: Download complete
[2020-01-07T04:20:00.619Z] ae4a0e1e8235: Verifying Checksum
[2020-01-07T04:20:00.619Z] ae4a0e1e8235: Download complete
[2020-01-07T04:20:00.876Z] ae4a0e1e8235: Pull complete
[2020-01-07T04:20:01.134Z] c9875e10f676: Pull complete
[2020-01-07T04:20:01.701Z] ccde658bec80: Pull complete
[2020-01-07T04:20:01.701Z] Digest: sha256:45c58b44ea3bba44ac3a45f4c9765aa622e509d279d43bcc4de62afe0fe39709
[2020-01-07T04:20:01.958Z] Status: Downloaded newer image for gatsbyjs/gatsby:latest
[2020-01-07T04:20:01.958Z]  ---> 81c163c933f0
[2020-01-07T04:20:01.958Z] Step 15/15 : COPY --from=builder /usr/src/app/public/ /pub
[2020-01-07T04:20:20.030Z]  ---> b8e299fb0d3f
[2020-01-07T04:20:20.030Z] Successfully built b8e299fb0d3f
[2020-01-07T04:20:20.030Z] Successfully tagged jenkinsinfra/plugin-site:26-c23fa7
[2020-01-07T04:20:20.047Z] [Pipeline] script
[2020-01-07T04:20:20.096Z] [Pipeline] {
[2020-01-07T04:20:20.232Z] [Pipeline] withCredentials
[2020-01-07T04:20:20.322Z] Masking supported pattern matches of $DOCKER_CONFIG
[2020-01-07T04:20:20.332Z] [Pipeline] {
[2020-01-07T04:20:20.368Z] [Pipeline] sh
[2020-01-07T04:20:20.680Z] /home/jenkins/workspace/Infra_plugin-site_PR-76@tmp/durable-0112c660/script.sh: 1: /home/jenkins/workspace/Infra_plugin-site_PR-76@tmp/durable-0112c660/script.sh: Syntax error: Unterminated quoted string
[2020-01-07T04:20:20.798Z] [Pipeline] }
[2020-01-07T04:20:20.911Z] [Pipeline] // withCredentials
[2020-01-07T04:20:20.942Z] [Pipeline] }
[2020-01-07T04:20:21.018Z] [Pipeline] // script
[2020-01-07T04:20:21.059Z] [Pipeline] }
[2020-01-07T04:20:21.100Z] [Pipeline] // stage
[2020-01-07T04:20:21.200Z] [Pipeline] stage
[2020-01-07T04:20:21.209Z] [Pipeline] { (Deploy to netlify)
[2020-01-07T04:20:21.225Z] Stage "Deploy to netlify" skipped due to earlier failure(s)
[2020-01-07T04:20:21.247Z] [Pipeline] }
[2020-01-07T04:20:21.298Z] [Pipeline] // stage
[2020-01-07T04:20:21.394Z] [Pipeline] }
[2020-01-07T04:20:21.434Z] [Pipeline] // ansiColor
[2020-01-07T04:20:21.516Z] [Pipeline] }
[2020-01-07T04:20:21.549Z] [Pipeline] // timeout
[2020-01-07T04:20:21.575Z] [Pipeline] }
[2020-01-07T04:20:21.607Z] [Pipeline] // withEnv
[2020-01-07T04:20:21.634Z] [Pipeline] }
[2020-01-07T04:20:21.666Z] [Pipeline] // withEnv
[2020-01-07T04:20:21.702Z] [Pipeline] }
[2020-01-07T04:20:21.739Z] [Pipeline] // node
[2020-01-07T04:20:21.792Z] [Pipeline] End of Pipeline
[2020-01-07T04:20:23.584Z] 
[2020-01-07T04:20:23.584Z] GitHub has been notified of this commit’s build result
[2020-01-07T04:20:23.584Z] 
[2020-01-07T04:20:23.584Z] ERROR: script returned exit code 2
[2020-01-07T04:20:23.584Z] Finished: FAILURE

Powered by the Comment Logger

@jenkinsadmin
Copy link

Build failed; the context from the latest run is:

Expand to view
[2020-01-10T04:57:06.098Z] Pull request #76 updated
[2020-01-10T04:57:06.270Z] Connecting to https://api.github.com using jenkinsadmin/****** (GitHub access token for jenkinsadmin)
[2020-01-10T04:57:06.857Z] Connecting to https://api.github.com to check permissions of obtain list of halkeye for jenkins-infra/plugin-site
[2020-01-10T04:57:07.536Z] Obtained Jenkinsfile from bcfbbdaeba589088b19e44525266a824fb12ce4c+6cb7ce414ac4a54f01683b4adc34a574eb8059c7 (a0dd0a3f8851fb424872b7014f8a2251322094fc)
[2020-01-10T04:57:07.536Z] Running in Durability level: MAX_SURVIVABILITY
[2020-01-10T04:57:09.245Z] 
[2020-01-10T04:57:09.245Z] GitHub has been notified of this commit’s build result
[2020-01-10T04:57:09.245Z] 
[2020-01-10T04:57:09.246Z] org.codehaus.groovy.control.MultipleCompilationErrorsException: startup failed:
[2020-01-10T04:57:09.246Z] WorkflowScript: 105: unexpected token: } @ line 105, column 1.
[2020-01-10T04:57:09.246Z]    }
[2020-01-10T04:57:09.246Z]    ^
[2020-01-10T04:57:09.246Z] 
[2020-01-10T04:57:09.246Z] 1 error
[2020-01-10T04:57:09.246Z] 
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.ErrorCollector.failIfErrors(ErrorCollector.java:310)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.ErrorCollector.addFatalError(ErrorCollector.java:150)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.ErrorCollector.addError(ErrorCollector.java:120)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.ErrorCollector.addError(ErrorCollector.java:132)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.SourceUnit.addError(SourceUnit.java:350)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.antlr.AntlrParserPlugin.transformCSTIntoAST(AntlrParserPlugin.java:144)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.antlr.AntlrParserPlugin.parseCST(AntlrParserPlugin.java:110)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.SourceUnit.parse(SourceUnit.java:234)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.CompilationUnit$1.call(CompilationUnit.java:168)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.CompilationUnit.applyToSourceUnits(CompilationUnit.java:943)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.CompilationUnit.doPhaseOperation(CompilationUnit.java:605)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.CompilationUnit.processPhaseOperations(CompilationUnit.java:581)
[2020-01-10T04:57:09.246Z] 	at org.codehaus.groovy.control.CompilationUnit.compile(CompilationUnit.java:558)
[2020-01-10T04:57:09.246Z] 	at groovy.lang.GroovyClassLoader.doParseClass(GroovyClassLoader.java:298)
[2020-01-10T04:57:09.246Z] 	at groovy.lang.GroovyClassLoader.parseClass(GroovyClassLoader.java:268)
[2020-01-10T04:57:09.246Z] 	at groovy.lang.GroovyShell.parseClass(GroovyShell.java:688)
[2020-01-10T04:57:09.246Z] 	at groovy.lang.GroovyShell.parse(GroovyShell.java:700)
[2020-01-10T04:57:09.246Z] 	at org.jenkinsci.plugins.workflow.cps.CpsGroovyShell.doParse(CpsGroovyShell.java:142)
[2020-01-10T04:57:09.246Z] 	at org.jenkinsci.plugins.workflow.cps.CpsGroovyShell.reparse(CpsGroovyShell.java:127)
[2020-01-10T04:57:09.246Z] 	at org.jenkinsci.plugins.workflow.cps.CpsFlowExecution.parseScript(CpsFlowExecution.java:561)
[2020-01-10T04:57:09.246Z] 	at org.jenkinsci.plugins.workflow.cps.CpsFlowExecution.start(CpsFlowExecution.java:522)
[2020-01-10T04:57:09.246Z] 	at org.jenkinsci.plugins.workflow.job.WorkflowRun.run(WorkflowRun.java:327)
[2020-01-10T04:57:09.246Z] 	at hudson.model.ResourceController.execute(ResourceController.java:97)
[2020-01-10T04:57:09.246Z] 	at hudson.model.Executor.run(Executor.java:429)
[2020-01-10T04:57:09.246Z] Finished: FAILURE

Powered by the Comment Logger

Jenkinsfile Outdated
sh "docker push ${imageName()}:${imageTag()}"
}
/* -> https://github.com/Azure/blobxfer
Require credential 'JAVADOC_STORAGEACCOUNTKEY' set to the storage account key */
Copy link
Member

Choose a reason for hiding this comment

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

Credential name needs updating or comment removed

Copy link
Member

Choose a reason for hiding this comment

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

Ah sorted already

Copy link
Member Author

Choose a reason for hiding this comment

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

.. i was very confused, I remember specifically removing that line and didn't think i committed it.

Copy link
Member

@timja timja left a comment

Choose a reason for hiding this comment

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

LGTM, once the storage account is in place with creds on ci.jenkins.io we can ship I believe

Jenkinsfile Outdated Show resolved Hide resolved
Jenkinsfile Outdated Show resolved Hide resolved
@timja
Copy link
Member

timja commented Jan 10, 2020

Awesome. is there any way to test before merging? how about the other parameters for the uploader? i kinda guessed blindly

🤷‍♂ 🚢

@halkeye halkeye merged commit 2d1833a into jenkins-infra:master Jan 10, 2020
@halkeye halkeye deleted the gatsby branch January 10, 2020 20:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants